美文网首页你好,IT产品之旅app精
策划006-App界面设计风格

策划006-App界面设计风格

作者: 夏林X | 来源:发表于2015-08-23 17:23 被阅读9461次
App界面设计风格

 APP设计风格是指APP通过主要的几种颜色搭配、页面布局和NPC等给用户呈现出的整体视觉感受。

一个APP开始启动设计时,第一步应该用主要页面定下整个APP的设计风格,然后其他页面按着统一的设计风格进行细致的设计美化。统一设计风格能给用户呈现整体一致的视觉体验,有利于传达产品整体的品牌形象;也方便设计团队制定设计规范,减少设计风格不一致带来的沟通成本。

 APP设计风格从视觉效果上至少给用户传达了两个信息:一是APP的整体基调。二是APP的目标人群。

微信、QQ界面截图

拿微信和QQ例子来说:微信是黑、绿、白三种主要颜色搭配,中规中矩的布局呈现给用户稳重、信赖的感觉,更像是成人的沟通工具。QQ默认皮肤是浅蓝、浅灰、白三种主要颜色搭配,灵活的布局交互呈现给用户活泼、有趣的感觉,更偏向爱玩、爱新奇的年轻用户。

为什么同样是即时通讯社交应用,设计风格差距这么大?这正是由产品的定位和目标用户决定的。微信口号是“微信,是一个生活方式”,这种大而全的定位,注定微信设计风格要更谨慎和中性化;另一方面据腾讯官方数据统计86%微信用户年龄集中在18-35岁,90%用户职业为企业员工、学生,目标用户也决定了微信设计风格的稳重、成熟和高端化。而QQ口号是“乐在沟通”,定位明确为娱乐化的社交应用,因此QQ设计风格是允许活泼有趣、甚至个性化(用户可切换多种不同设计风格皮肤);另一方面QQ兼容人群更广,相对微信来说更年轻、更活泼,如中小学生的忠实沟通工具仍是QQ。

原则上产品经理不应该干扰限制设计师的创意和灵感,但产品定位是什么、产品目标人群是谁。以上两点产品经理在提设计需求之前务必清晰传达到给设计师。

那么设计师出的稿子,如何判断是不是符合我们产品的设计风格呢?这里要求产品经理必须把设计的常识和基础原理弄懂,阅读相关的设计书籍,并且有意识的去体验和对比各种App产品的设计,提高产品的鉴赏能力。

移动APP产品的设计首先应该紧跟业界的主流设计风格:扁平化设计。扁平化设计有明显的几个好处:

    1、界面美观、简约大方、条理清晰

    2、设计元素上强调抽象、极简、符号化,去除冗余的装饰效果突显App的文字图片等信息内容。

    3、完美兼容pc网站、安卓、ios等不同系统的平台和不同屏幕分辨率的设备,适应性强。

APP产品设计定为扁平化,然后考验的是设计师界面配色的专业功力了。在设计风格表现上,颜色占据了80%以上的视觉体验。因此要做好设计风格,主要做好界面的颜色搭配和分布。另外颜色是有情感的,不同的色彩能给于用户不同的印象和感受,而且不同的人群对颜色偏好也是不一样的。所以在为APP设计进行配色时,需要考虑不同用户的喜好和体会配色给用户带来的视觉感受。

参考:客户网站分析公司KISSmetrics的调查报告图表

从图表上看男女都喜欢绿色、蓝色,这里也说明微信和QQ为什么分别使用绿色和蓝色作为APP重要的配色之一;男女都讨厌橙色、褐色。不同的是男喜好黑色,女喜好紫色;男讨厌紫色,女讨厌灰色。图表仅供参考,在本人的产品体验考察来看,在女性的颜色偏好中有着不可撼动的地位却是红色、粉红色。如使用红色作为主要设计风格的女性app:

闺蜜圈、lespark、美啦、美柚界面截图

设计风格的配色除了要注意男女性的喜好差别,还应该重视通过冷暖色彩+明暗亮度搭配表现给用户的印象和心理感受。详见《色彩在移动APP设计中的应用》

色彩情感:红色、金黄色、橙色 麦当劳APP界面截图 色彩情感:深灰蓝、中性灰 facebook界面截图 色彩情感:绿色、紫色、青色 地铁跑酷界面截图 配色方案反馈的情感意像

总的来说,设计风格是设计起始的第一步,定好了设计风格,后续的设计工作才能继续安排。要确保设计风格匹配用户人群的喜好,符合APP的定位以及给用户传递APP正面良好的形象。确定设计风格阶段,产品经理和设计师花费再多的时间和精力来折腾也是值得的。

设计风格确定后,咱们可以继续下篇整理《策划007-App界面交互设计规范》。

相关文章

  • 策划006-App界面设计风格

    APP设计风格是指APP通过主要的几种颜色搭配、页面布局和NPC等给用户呈现出的整体视觉感受。 一个APP开始启动...

  • 策划007-App界面交互设计规范

    在上篇《策划006-APP界面设计风格》确定下来后,产品经理(兼交互设计)还不用着急将所有的交互稿扔给设计师进行细...

  • 公众号策划

    公众号策划可以分为名称策划、简介策划、风格策划、选题策划、欢迎策划、头像策划、按钮策划、内容平台策划和传播平台策划...

  • UI设计界面流行风格,扁平化与拟物化

    界面设计风在不断发展变化,扁平化和拟物化是现代流行的界面设计风格,两种风格本身都存在着优缺点,常常让人拿来比较。设...

  • 界面设计中的插画风格

    界面设计中的插画风格 一、界面设计插画的功能: 1、传递情绪 2、抓住核心要素,减少视觉负担 3、品牌传达 目前插...

  • <转>交互干货必收 | App界面交互设计规范

    在上篇《APP界面设计风格》确定下来后,产品经理(兼交互设计)还不用着急将所有的交互稿扔给设计师进行细致的界面设计...

  • 深色风格界面设计指南

    作为一名设计师,制定和把控设计风格是我们的职责。在开始设计一个产品的时候,我们往往会根据产品的功能,受众,以及想要...

  • [组内分享] iOS7人机界面准则PPT+讲稿(多图)

    从iOS6到iOS7:扁平化是界面设计的必然趋势 在过去几年里,软件和APP的界面设计风格发生了迅速变化,由3D、...

  • iOS设计里念(人机界面准则)

    从iOS6到iOS7:扁平化是界面设计的必然趋势 在过去几年里,软件和APP的界面设计风格发生了迅速变化,由3D、...

  • 宣传片拍摄选景诀窍

    一、是否符合策划文稿的拍摄风格 在选取场景的时候,需要注意拍摄场景与策划文稿中的风格的相关性,这样才能保持整部宣传...

网友评论

  • e83cc9b55ec8:开头的npc指的是?请赐教
    夏林X: @拜UI叉 这个是游戏术语,指非玩家角色,这里指app的吉祥物形象或品牌形象
  • 黑个:NPC是什么意思,抱歉,刚接触这些。 :disappointed_relieved:
    夏林X:@VMrRight 这个是游戏术语,指非玩家角色,这里指app的吉祥物形象或品牌形象
  • 9d8bba2c0044:不错不错
  • Yick:你好,请问你在文中提及的《色彩在移动APP设计中的应用》这一资源,是书籍吗,还是一篇文章,特别特别想看,查了没查到,还麻烦作者明示*^_^*
    Yick: @鹰眼Eeyes 好的,谢谢你哦*^_^*
    夏林X:@Yick 这个在百度文库找到的,你可以去搜索一下
  • b6ac9d9cbf2b:好赞,我是做策划的,这种文章对我很有用
  • 2129d5e98497:说得很有道理!
  • 设计男KeNick:很棒的内容
  • 4c0cec7e09c6:对工作有帮助
  • 679a61dd0937:写的很深刻
  • dmetan:必须给赞👍这样有技术的东西对工作也好,生活也好都有帮助。
  • 745d1f6284d8:不错
    夏林X:@风晓峰 谢谢。
  • 08500985ec0f:干货!

本文标题:策划006-App界面设计风格

本文链接:https://www.haomeiwen.com/subject/wkrgqttx.html