figma应用——面向用户的咖啡点单APP的设计过程记录
目录
- 概述
- 设计阶段
- 1、Brainstorm
- 2、用户分析
- （1）用户画像
- （2）竞品分析
- （3）用户旅程地图
- （4）用户需求分析
- 3、点单APP的demo设计
- （1）整体布局逻辑概览
- （2）主要界面效果预览
- 总结
概述
此文旨在记录本学期课程中，运用一整套设计思维方法进行一个咖啡点单APP设计的过程。受限于时间，并且为了更好强调突出设计过程中小组成员协助合作，此次全程采用Trello的协同功能和Figma的设计功能并举的方式进行APP的设计。本人在其中主要担任视觉设计师的工作（主要把控设计的整体视觉感受和总体样式，承担APP的主要UI设计与实现）
设计阶段
1、Brainstorm
针对咖啡主题，小组内进行关键词联想的头脑风暴，旨在扩散思维，挖掘更多潜在可用信息，为后面咖啡点单APP设计提供灵感。（附：一些Brainstorm的截图）
2、用户分析
由于我们针对的主要群体是年轻用户，同时根据周边人的调研，我们初步构想出了三个具有代表性的用户画像。同时针对同类APP进行了竞品分析，最后完成了用户旅程地图和用户需求分析。
（1）用户画像
（2）竞品分析
（3）用户旅程地图
（4）用户需求分析
初步的，经分析后，主要存在以下比较突出的用户需求和痛点需要我们重点解决：
| 痛点 | 用户需求 |
|---|---|
| 市面上咖啡点单APP内容冗杂，广告植入繁多 | 简洁清晰的界面 |
| 部分APP界面整体色调不够统一，显得很乱 | 色调色系统一的界面 |
| 对各个品类缺少清晰的认识，不能做出最优选择 | 增强用户选择的导向性 |
| 缺少咖啡用户社交探讨的渠道 | 能够有日常进行有关咖啡探讨或分享的社群 |
3、点单APP的demo设计
（1）整体布局逻辑概览
由于临近期末，大家普遍时间匆忙，主要还是完成了对APP整体框架逻辑的设计，同时保证了一定的美观，具体细节上做的仍旧不是很完善。
（2）主要界面效果预览
1、首页
2、点单界面
3、社交界面
4、用户界面
总结
最后总体来说，我们针对主要的一些痛点和用户需求进行了设计，尽可能优化APP，初步达成了如简洁化界面、色系统一、用户社群交流的目的。虽然许多细节上仍旧值得打磨，但通过这次APP的设计过程，我更能将设计思维工具熟练运用到工程设计中，在面向用户设计，以人为本的思想这一块有了更切实的体会。
figma应用——面向用户的咖啡点单APP的设计过程记录相关推荐
- 情人节脱单计划 小白也能行的超详脱单App攻略 快为你喜欢的ta准备吧(附模板与代码)
情人节脱单计划 小白也能行的超详脱单App攻略 快为你喜欢的ta准备吧(附模板与代码) CSDN拯救"直男"计划--CSDN为爱助力,桃花朵朵开入口 祝各位程序猿或看到本篇文章的朋 ...
- 深陷财务造假丑闻，瑞幸咖啡爆单了！外卖小哥惊呼：单子多得忙不过来...烧钱模式已走到尽头？...
点击上方 "程序员小乐"关注, 星标或置顶一起成长 每天凌晨00点00分, 第一时间与你相约 每日英文 A single hand that wipes tears during ...
- 约单APP——互联网创业好项目
约单APP--互联网创业好项目,约单app是一款时间共享和技能交易的平台,是连接人与人即时服务的互助平台.用户通过发起各种需求,经过系统匹配,在短时间内即可收到附近人的响应,从而满足自己工作,生活中的 ...
- 社交网络app数据库设计_建立自己的社交网络，游戏服务器或知识库！ -Sourcehunt
社交网络app数据库设计 It's time for our monthly hunt for new open source libraries to use and contribute to! ...
- APP界面设计的视觉思维！
APP界面设计师基于用户交互体验基础上创设的界面设计,通过对用户体验的视觉思维研究,使得APP界面设计不仅拥有独特的个性与品位,还能够为用户带来舒适.自由.良好的视觉感受,在实际的操作中更加符合用户的 ...
- iOS设计 - 一款APP从设计稿到切图过程概述
这篇文章站在GUI设计师的角度概述了APP从项目启动到切片输出的过程,相当于工作流程的介绍.这里写的不是一种规范,只是一种工作方法,加上技术的更新是非常快的,大家在具体工作中,一定要灵活运用. 这里我 ...
- 一款APP从设计稿到切图过程全方位揭秘 Mark
纯干货!一款APP从设计稿到切图过程全方位揭秘 @BAT_LCK :我本身是一名GUI设计师,所以我只站在GUI设计师的角度去把APP从项目启动到切片输出的过程写一写,相当于工作流程的介绍吧.公司不同 ...
- 移动APP测试用例设计实践经验（转载）
前言杂谈 在聊移动APP测试用例设计之前,我请大家先思考如下2个问题: 第一,我们为什么要做好测试用例设计?--why? 第二,好的测试用例设计有什么共性? --what? 深入思考这2个问题的答案是 ...
- 移动APP测试用例设计实践经验
前言杂谈 在聊移动APP测试用例设计之前,我请大家先思考如下2个问题: 第一,我们为什么要做好测试用例设计?--why? 第二,好的测试用例设计有什么共性? --what? 深入思考这2个问题的答案是 ...
最新文章
- 数学、物理算法ActionScript实现(2)
- Qt QTcpSocket 对连接服务器中断的不同情况进行判定
- oracle中使用子查询为何取到大于自然数1 rownum 浅度解析
- .Net思想篇:为何我们需要思想大洗礼？
- php获取qzonetoken,QQ一键登录实现
- java版电子商务spring cloud分布式微服务b2b2c社交电商：服务容错保护（Hystrix断路器）...
- form表单提交，后台实体类接收转义问题
- eclipse实现Android登录功能,eclipse开发安卓登录
- VS2015 中使用 MVC4
- jquery1.8 获取option的对象进行操作
- mysql 前端proxy_【4.分布式存储】-mysql及proxy
- LeetCode（985）——查询后的偶数和（JavaScript）
- Github 简明教程 - 操作标签
- 【zabbix系列】报警系统的设置和排除
- App Domains and dynamic loading
- 电子证件照尺寸怎样裁剪？怎么把照片裁剪成2寸？
- 【原创】ES5高效封装WIN10系统教程2020系列（一）母盘定制
- 【推荐】工业互联网资料合集
- mysql 不等于 优化_Mysql优化
- Linux Deploy搭建移动渗透系统