以产品经理视角进行系统化描述，可参考以下模版：

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 requestsimport jsonfrom PIL import Imagefrom 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 requestsimport jsonfrom PIL import Imagefrom 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')

02

用AI生成代码，到云端Notebook测试打磨

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返回修改的代码也可以快速修正。

03

部署上线

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

完成以上操作，即可发布上线并得到分享链接

小程序体验：

04

总结

人人都是应用开发者，用模型开启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')

课代表的工具箱总结：

模型库及API-Inference：找到合适的模型实现产品功能，https://modelscope.cn/models

Notebook：开箱即用的云端环境，方便前后端调试，https://modelscope.cn/my/mynotebook

创空间：

可将代码部署上线，支持分享，https://modelscope.cn/studios

?看到这，你学会了嘛？

?现在，还可以来参加魔搭的应用挑战赛！赢取万元天猫超市卡+超长GPU算力时长！

?https://modelscope.cn/brand/view/Space

?与各位开发者过招，其乐无穷~

点击阅读原文，即可报名参加！~