APP UI设计从入门到精通(一)
UI设计教程
一、APP UI设计概述:
1. 什么是UI设计?
UI定义:用户界面,Ui设计不仅仅指界面美化设计,从文字的意思上能够看出,UI还与“用户与界面”有直接的交互关系。
2. 什么是APP?
APP定义:手机应用程序,也被成为应用。
APP分类:
个人用户APP:面向个人消费的
企业级APP:面向企业用户开发的
3. 用于制作APP UI的photoshop软件
Photoshop简称ps,是一款功能强大的图形图像软件。
一、APP UI设计需要掌握那些技术
1. APP UI设计师的职业分类:
软件UI设计师/工程师 IOS APP设计师、APP UI设计师、移动端UI设计师和Web APPUI设计师
2. 设计师的要求:
1) 移动手机客户端软件及WAP与WEB网站的美术创意、UI界面设计,把握软件的整体视觉效果。
2) 准确理解产品需求和交互原型,配合工程师进行手机软件及WAP、WEB界面优化,设计出优质用户体验的界面效果图
3) 熟练掌握手机客户端软件UI制作技术,能够熟练使用各种设计软件(photoshop、lIIustrator、Dreamweaver、flash等)游湖界面设计能力,对视觉设计、色彩有敏锐的观察和分析能力。
4) 为产品推广和形象设计服务,关注所设计的产品设计动向,为产品提供专业的美术意见和建议
5) 负责公司网站的设计、改版、更新,对公司的宣传产品进行美工设计
注释:互联网设计趋势在于产品的用户体验设计,谁的产品体验做得好,谁就有一席之地!(用户体验设计在于界面的设计)
二、出色的APPUI界面设计
1. 产品团队划分:
产品经理:领头人物,对用户的需求进行细致研究,针对广大用户的需求进行规划(PPT、project、Visio)
产品设计师:功能方面设计,考虑技术是否具有可行性(word、AXure)
用户体验师:用户需要了解商业层面内的东西、应该从商业价值角度考虑,对产品与用户交互方面进行改善(Dreamweaver)
UI设计师:对用户界面进行美化(photoshop、Illustratou)
2. APP界面设计与项目流程
1) 产品定位
产品的功能,依据什么而欧这样的产品,要达到什么效果?
2) 设计风格
当产品以面向人群定位(清新、绚丽) 当产品以商业价值定位(稳重、大气)
3) 产品控件
对产品用下拉菜单还是下拉滑屏,用多选框还是滚动条,控件的数量要控制在多少个?
4) 制定方案
一般做出两套以上的设计方案
5) 提交选定方案
进行评定,选出最佳方案
6) 美化方案
根据效果图进行美化设计
3. 视觉设计:
通过视觉的直观感觉对原型设计进行加工,如文本,按钮的背景/高光
APPUI设计理论
1. 用户的操作习惯
用户在面对移动应用时三种心态:
1) 微任务
2) 查看周围情况
3) 打发无聊时间
功能的要求
1) 应用最好小而准,不要大而全
2) 满足用户的情景需求
3) 要帮助用户去消磨时间
2. 界面布局
3. 操作简单
理解用户需求,理解他在想要什么?现在的心态是什么?情绪是什么?
4. 隐藏或删除
5. 区域内容或功能
明确的分区
6. 在操作方式上创新
7. 在设计中投入情感
8. APP UI的配色理论
如何配色?设计是一个”理解-分解-在构成”的艺术
配色部分:主色调、辅色调、点睛色、背景色
蓝色和白色调和:看起来很权威很官方的配色(蓝色不是科技蓝)
彩虹糖果色和黑色协调:是一种梦幻活泼的鲜艳配色
橙色和蓝色协调:橙色和蓝色对比的和谐统一,不仅有活力,而且感觉很有时间感
绿色和白色调和:绿色和白色调和后是一种自然、有呀的清新配色
红色和黑色调和:红色和黑色调和行政一种金属冷色+热烈的红色对比配色
一、完整APP UI设计流程
UI,即用户界面,它包含:交互设计、用户研究、界面设计
一个通用的消费类软件界面设计大体分为以下5个步骤:
1. 需求阶段:
依然离不开3W的考虑(Who、where、why)也就是使用者、使用环境、使用方式的需求。
2. 分析设计阶段:
3. 调研验证阶段
4. 方案改进阶段
5. 用户验证反馈阶段
二、图标的设计流

一、如何让图标更具有吸引力
1. 同一组图标风格的一直性:(配色、透视、尺寸、绘制技巧)
2. 合适的原创隐喻











































































