Stuart: 0基础教学系列之Coze“用户界面”创建初体验
输入“/”快速插入内容
Stuart: 0基础教学系列之Coze“用户界面”创建初体验
Stuart: 0基础教学系列之Coze“用户界面”创建初体验
飞书用户43898月1日修改
💡
省流: 玩起来有门槛, 建议观望一阵等优化. 下面是详细内容.
花了一整天时间, 从0开始搭建了一个小功能的应用: 抠图应用.
为的是更好的理解coze应用的“用户界面”功能. 期望通过分享一些切身经历, 能帮助想同样想制作应用的同学们少走点弯路.
从 To Me 到 To C
对比智能体能提供的“对话式”交互界面, 应用提供的“按键式”交互界面舒服了很多: 它可以有效引导用户的使用.
功能不复杂, 但是我很常用它: 我经常画PPT, 做海报的时候需要抠些图, 网上有些抠图工具, 要么不方便, 要么技术很过时, 要么很贵. 于是我就捏了这么一个bot.
智能体“对话式”交互界面
这个bot我自己用起来很方便, 我就是把图往里面一扔, 就给我抠出来了. 后来我想到迭代了一版: 因为我通常需要自己从网上下载图片到电脑, 然后上传, 很麻烦, 于是我就直接扩展了一下 -- 把图片链接扔进去直接给我抠.
虽然有一句开场白貌似能提示大家怎么用, 而且适应了使用方法后用起来很舒服 (至少我个人这么觉得).
但是这个bot的使用量不高, 因为大多数人看到这个简陋的界面, 天然的会觉得它肯定不好用, 不专业.
于是对比下下面这个节目, 是不是很有专业的感觉? 虽然其实功能效果是一样的. 😆
应用“按键式”交互界面
在coze上的这个界面其实很容易引导用户, 告诉大家这个功能是二选一的, 而且功能上也做了规避: 一个按钮只生效对应区域的内容. 上传后原图显现, 然后点“开始抠图”.
代价: 高开发成本
需知上面那个智能体, 我只要半小时不到就能造出来. 但是下面这个应用, 我花了整整一天. 我回顾了整个搭建过程, 除去很多学习上手浪费的时间, 我觉得在熟练的情况下要做到这样的程度也要半天.
接下来说下, 我觉得小白们上手必然会遇到的几个问题.
控件排版
首先会遇到的一定是这个: 当我们需要在页面上放一堆控件, 比如文字, 按钮, 输入框, 图片啥的, 就得考虑排版. 对于做过网页/前端开发的同学这不是什么难事, 可以直接跳过. 对于没做过的同学, 我现场硬编一个口诀给大家: “容器套娃, 横竖都容器”.
容器在左边这个图标.