广州总部电话:020-85564311
广州总部电话:020-85564311

广州网站建设-小程序商城开发-广州小程序开发-企业微信开发公司-网站建设高端品牌-优网科技

20年
互联网应用服务商
请输入搜索关键词
知识库 知识库

优网知识库

探索行业前沿,共享知识宝库

B端产品---界面设计的流程
发布日期:2025-04-17 17:56:32 浏览次数: 831 来源:构建产品思维
           B端产品经理在产品设计的时候,在完成了核心业务流程,产品定义,应用架构,功能模块,业务建模,角色和权限梳理,然后到页面流转梳理的这一个步骤,详细到每个操作需要访问哪些页面,产品一共有多少页面。这个时候就需要为每个页面设计具体的交互功能,也称为界面设计。
          在进行界面设计之前的步骤很多,经过前期上面那些步骤,我们会发现,现在对整个业务形态和系统构建已经一目了然了。对整个项目和产品的掌控力越来越得心应手。这个时候再来界面设计就非常容易,并且胸有成竹。
1. 界面设计的流程
        在公司团队分工明确,人力充足的情况下,设计一套B端的产品时,界面设计的步骤一般如下。
a.  产品经理绘制线框原型图,描述软件中每个页面的设计需求。
b. UE设计师协助产品经理完善和补充交互体验,并制作交互原型。
c. UI设计师基于交互原型进行美工设计,生成切图文件,并给到前端开发工程师。
d.前端开发工程师拿到切图文件,进行前端开发,包含实现交互,动效等功能。
    当一套完整的业务系统上线后,如果新增页面交互和流转功能,仍然需要UE和UI设计师的支持。一般前端工程师会把一些常用的按钮,文本框,下拉框,表格等常用控件,设计为组件的方式,便于在后期的产品中进行直接调用。最好B端产品经理也要懂一些UE和UI的知识,这样便于和UE和UI交互设计师进行沟通。
2. 绘制原型图
        产品经理需要将每个页面的排版央视,控件设计及交换效果,用通俗易懂的形式表达出来,方便相关人员快速理解。原型图是一种很好的表现形式,绘制原型图的工具很多,一般常用的有Processon, Axure,Figma,墨刀等。
       绘制原型图目的在于表达清楚界面上的交互功能设计,而非UI效果。下图展示了通过Axure绘制的人工智能质检SAAS平台的原型图,图中包含的页面和功能信息有:操作界面,参数设定,报表统计,告警事件,图片记录,操作记录,系统设置等功能模块

优网科技,优秀企业首选的互联网供应服务商

优网科技秉承"专业团队、品质服务" 的经营理念,诚信务实的服务了近万家客户,成为众多世界500强、集团和上市公司的长期合作伙伴!

优网科技成立于2001年,擅长网站建设、网站与各类业务系统深度整合,致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设(品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、DIY体验、720全景展厅及3D虚拟仿真)、移动端应用(手机站APP开发)、微信定制开发(微信官网、微信商城、企业微信)、微信小程序定制开发等一系列互联网应用服务。


我要投稿

姓名

文章链接

提交即表示你已阅读并同意《个人信息保护声明》

专属顾问 专属顾问
扫码咨询您的优网专属顾问!
专属顾问
马上咨询
扫一扫马上咨询
扫一扫马上咨询

扫一扫马上咨询