本文试图最短路径、最轻模式来做一个应用,实现一个需求!仅需三大步+9小步,以下为手把手教学流程。
以产品经理视角进行系统化描述,可参考以下模版:
1、需求概述:解决什么问题,实现什么功能,有个整体的介绍。
2、交互界面描述:比如输入框实现什么功能、输出框实现什么功能,如何排布及交互(传统互联网产品经理基本功)
3、提供功能工具:需要找到具体可以实现某个功能的AI模型(AI产品经理基本功,知道AI都有哪些能力),比如生成文章插图可以使用一个可以生成像素风格的文生图模型,地址如下,同时也获得具体的API使用方式
https://modelscope.cn/models/MusePublic/326_ckpt_SD_XL/summary?version=1552
Demo成品示例:
https://modelscope.cn/studios/hicicada/weixinxiaozhuli
对应需求描述示例
1、整体需求描述:
基于gradio做一个应用:用户输入公众号文章内容后,点击一键生成按钮,自动生成标题、摘要内容和一个基于摘要英文promp生成的文章配图。
2、前端核心模块,依次运行
用户输入框:提醒用户输入公众号文章内容;
标题输出框:根据用户输入自动生成5个适合公众号的标题,64字内;展示思考过程,思考输出和最终标题输出用两个独立框,左右布局;流式输出并多行完整展示;
摘要输出框:根据用户输入自动生成适合公众号的摘要,120字内;展示思考过程,思考输出和最终摘要输出用两个独立框,左右布局;流式输出并多行完整展示;
文章配图prompt输出框:根据摘要内容自动生成英文prompt,用于文生图;展示思考过程,思考输出和最终promp输出用两个独立框,左右布局;流式输出并多行完整展示;
注意:最终promp输出框只输出用于文生图的英文prompt,简洁有效;
promp输出框可编辑,然后可点击重新生成按钮即可重新生成图片;
文章配图输出框:根据生成的英文prompt或者编辑的英文prompt,生成适合的配图;生成2张图,尺寸都为1024x500
整体视觉风格:青色+紫色风格的科技风
3、服务端API
标题输出、摘要输出、prompt输出均调用以下API,格式如下,请严格遵守
import requests
import json
from PIL import Image
from io import BytesIO
url = 'https://api-inference.modelscope.cn/v1/images/generations'
payload = {
'model': 'djyzcp123/gjerc',#ModelScope Model-Id,required
'prompt': 'A golden cat'# required
}
headers = {
'Authorization': 'Bearer 换成你的魔搭token',
'Content-Type': 'application/json'
}
response = requests.post(url, data=json.dumps(payload, ensure_ascii=False).encode('utf-8'), headers=headers)
response_data = response.json()
image = Image.open(BytesIO(requests.get(response_data['images'][0]['url']).content))
image.save('result_image.jpg')
文章配图调用API:
import requests
import json
from PIL import Image
from io import BytesIO
url = 'https://api-inference.modelscope.cn/v1/images/generations'
payload = {
'model': 'djyzcp123/gjerc',#ModelScope Model-Id,required
'prompt': 'A golden cat'# required
}
headers = {
'Authorization': 'Bearer 换成你的魔搭token',
'Content-Type': 'application/json'
}
response = requests.post(url, data=json.dumps(payload, ensure_ascii=False).encode('utf-8'), headers=headers)
response_data = response.json()
image = Image.open(BytesIO(requests.get(response_data['images'][0]['url']).content))
image.save('result_image.jpg')
1、生成代码
可以用专业编程工具如cursor,也可以直接用大模型生成。本次评测了Cursor、DeepSeek-R1、QwenMax-QWQ、Claude3.7,均可以完成核心功能代码,将代码保存为.py文件。
代码生成的思考过程
2、Notebook中运行代码
Notebook预装镜像、开箱即用,不需要额外安装依赖(比如python、gradio等);
Notebook地址:https://modelscope.cn/my/mynotebook,本次调用API,可使用CPU环境,长期完全免费!第一次使用需完成相关账号的注册和绑定。
上传.py文件后,运行代码!python /mnt/workspace/文件名.py 即可获取链接测试。
3、测试、打磨
前端:主要验收功能模块、布局排版
实测4个工具生成的前端界面略有不同,但都满足预期。
cursor | DeepSeek-R1 |
QwenMax-QWQ | Claude3.7sonnet |
服务端:主要验收功能是否跑通
实测功能均可以跑通,根据文章内容生成了标题、摘要、配图prompt及最终的文章配图。即时中间有小问题或者新需求,也是通过AI返回修改的代码也可以快速修正。
1、创空间基本设置
点此新建一个创空间:
https://modelscope.cn/studios/create
使用平台免费提供的CPU资源,按默认配置即可
2、关键步骤:将api key改为环境变量(为了保护你的key!!)
将Notebook中调试成功的文件,找出存放token的代码,做如下修改
before:
after:
# API configuration
MODEL_API_KEY =os.getenv('MODEL_API_KEY')
将key保存在环境变量中
3、在空间文件中上传Notebook中调试成功的文件,注意名字需改为app.py
完成以上操作,即可发布上线并得到分享链接
小程序体验:
人人都是应用开发者,用模型开启AI魔法,搭建万千应用!
应用可无限拓展,追求更多功能或者更好体验!
1、比如增加文章润色、微信群发文案等
2、比如插图风格可选
3、其他脑洞
示例demo:
魔搭专属表情包生成器
需求描述:
1、需求概述:
基于gradio,做一个表情包生成器
2、前端界面:
输入框:提醒用户输入表情包描述文本,比如形状像什么,在做什么。
选择框:用户可选择图片尺寸(size)
输出框1:将用户输入的文本自动翻译成英文prompt,自动都在最前面加上固定词“modalogo,A pixelated, bluish-green character,”,然后将合并后的英文用做文生图prompt;prompt支持编辑,旁边有按钮可点击重新生成。
输出框2:两个图片展示框,分别展示独立生成的图片。尺寸为800*1024
有独立进度条:展示图片生成进度
3、服务端API
1)文本生成API
from openai import OpenAI client = OpenAI( base_url='https://api-inference.modelscope.cn/v1/', api_key='换成你的token, # ModelScope Token ) response = client.chat.completions.create( model='deepseek-ai/DeepSeek-V3', # ModelScope Model-Id messages=[ { 'role': 'system', 'content': 'You are a helpful assistant.' }, { 'role': 'user', 'content': '你好' } ], stream=True ) for chunk in response: print(chunk.choices[0].delta.content, end='', flush=True)
2)图片生成API
import requests import json from PIL import Image from io import BytesIO url = 'https://api-inference.modelscope.cn/v1/images/generations' payload = { 'model': 'Saniac/modalogo',#ModelScope Model-Id,required 'prompt': 'A golden cat'# required } headers = { 'Authorization': 'Bearer 换成你的token', 'Content-Type': 'application/json' } response = requests.post(url, data=json.dumps(payload, ensure_ascii=False).encode('utf-8'), headers=headers) response_data = response.json() image = Image.open(BytesIO(requests.get(response_data['images'][0]['url']).content)) image.save('result_image.jpg')