0

你了解APP界面视觉设计的那些技巧吗?

 2 years ago
source link: http://www.chanpin100.com/article/127931
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
关闭
161381399460856551

你了解APP界面视觉设计的那些技巧吗?

  • 发布于3小时前

阅读567

一款应用程序里与众不同的用户界面(UI)能够给用户带来极致的体验,可是我们如何将自己的app界面设计得与众不同呢?今天,我们就来了解一下APP界面视觉设计的那些技巧。

一款应用程序里与众不同的用户界面(UI)能够给用户带来极致的体验,可是我们如何将自己的app界面设计得与众不同呢?今天,我们就来了解一下APP界面视觉设计的那些技巧。

你了解APP界面视觉设计的那些技巧吗?

一、高保真关键页设计

1.什么是高保真关键页?

为了决定产品最终视觉呈现而制作的视觉设计稿。

高保真

几乎完全按照实物来制作的原型就是高保真,产品的细节、真实的交互、UI等等。对于视觉设计来说,所谓的高保真就是要在页面设计中展示确定的颜色,字体,间距,图像,信息,以及UI控件的最终样式。

关键页

关键页是流程中具有最高优先级的屏幕,可能是功能优先级比较高的界面,也可以是具有代表性UI控件排列的界面。通常来说我们会选择至少5~10个界面来作为视觉化的关键页面。选择时考虑的重点是哪些页面更能代表产品的特征。

2.什么时候需要做高保真关键页设计?

在元素板完成,交互流程完成时。在元素板中提取设计风格和细节,在交互流程中选择代表性的界面。

案例:

客户给过来的品牌资料。

我们根据资料提供了3个设计方向。

客户选择了两种风格中间的风格。我们制作了元素板。给客户确认。

元素板确认后我们开始设计了最重要的两个关键页。

然后开始设计更多的关键页。

二、定义核心视觉元素

在项目的前期确定高保真关键页的同时,需要定义核心视觉元素规则。

比如颜色、字体字号、按钮、图标等。

三、制作视觉元件库

为什么要制作视觉元件库?

为了在设计过程中确保视觉风格的统一,以便在详细设计阶段更好的还原所有设计细节。

在设计新的组件和UI元素及验证视觉效果时,视觉元件库将不断扩展及更新。一般在项目初期可以制作一个通用性较强的常规元件库 ,同时不断开发新的页面设计。在项目后期,会提供一个包含所有屏幕设计中UI组件的完整的元件库。

功能设计阶段的视觉设计主要负责还原设计风格并着手制定设计规范。

四、高保真页面设计

在项目最后的落地阶段,必须要将所有交互线框图还原成视觉稿。是高保真原型的必要条件。

在还原视觉的过程中,可能有一些线框图并不容易那么容易被还原,可能是布局问题,也可能是信息层级问题,UI设计师要根据自己的专业角度去考量如何设计。

五、高保真原型设计

1.高保真原型(可交互)

2.原型工具

sketch、figma、principle等。

3.微交互

不能为了加而加,要考虑目的性。

以上内容就是“你了解APP界面视觉设计的那些技巧吗?”的全部内容了,如果你还想了解更多视觉设计以及产品经理的相关内容,可以来产品壹佰官方网站获取。

产品壹佰网站所提供的内容均来源于用户提供或网络搜集,由本站编辑整理,仅供个人研究、交流学习使用。如涉及版权问题,请联系本站管理员予以更改或删除。

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK