恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
产品视觉探索
0.0°
2021-05-09 原创文章 经验/观点 举报 3327 4 7 0


今天分享一些自己积累的一些大厂app的视觉分析,从色彩、版式、字体、产品气质等几个纬度来分析(文章有点长,但是希望大伙能看完,希望对大家有帮助)
注:文章内的色彩都是以HSB去做分析。

(坚持每日记录一个体验或者创意点子~)


1.QQ音乐

视觉分析:
1.QQ音乐品牌色为绿色,界面的设计主要以留白为主,绿色作为主色去点缀重要的信息,整体页面给人感觉非常舒适、清新、克制。
2.图标风格一直保持原有的设计风格,以面性的图标风格为主,图标色彩为绿色单色设计语言。
3.中性色也用的非常好,比如背景用的是B98的灰,非常接近白色但是又能与白色相区分,黑色用的是B10,而不是纯黑色,整体界面非常清新和自然。


2.绿洲视觉分析:
1.绿洲app从排版的形式上和Instagram很相似,不过其他地方层面的设计也是值得学习的。
2.色彩层面绿洲用的主色绿色有点偏向橄榄绿,明度和纯度都比较适中,整体感觉比较清新,辅助颜色为浅黄色。
3.在图标层面底部图标和首页主要的图标为线性风格,而消息列表、分享界面的图标利用的是黑色描边和灰白填充的描边,整体感觉是很符合绿洲的产品气质,而不是普普通通的简单线性的图标,有一些自己的东西在里面,挺有细节的。
4.我个人特别喜欢绿洲的IP,是个仙人掌,不过呢,设计师能把仙人掌画的非常可爱动人,当用户点赞时,弹出的爱心是和仙人掌结合,非常可爱有趣,包括空白页面也是利用了仙人掌的形象去做,整个产品都赋予了情感化,能让用户感知。


3.NIKE Rub Club

视觉分析:
1.第一次使用Nike Run Club,页面给用户的感觉细腻、大方,大字号和大间距具有很强的呼吸感。
2.色彩层面,延续着留白的风格,由于产品为运动类的app,色彩方面选用了明度和纯度很高的黄色,黄色充满活力、希望的颜色,很适合运动。中性色在app中只出现了纯黑色和B55的灰,整个页面非常干净整洁。
3.字体层面想说的是Nike的数字字体我非常的喜欢,粗壮、倾斜能传递一种速度、稳重向前冲的感觉,非常符合该app的产品气质,同时粗壮的字体用在重要的信息层面上使得更加醒目。
4.最主要所有Nike的app版式和字体间距都保持的很一致,可能用户不需要知道logo就能大概知道是什么app,重复了相同的规则,页面细节呈现的很好,每一个细节导致Nike的app都具备相同的产品气质,这也是一种品牌形象的传递,给用户树立了很强的品牌感。


4.潮汐视觉分析:
1.潮汐是一款睡眠、冥想、放松与专注的身心健康应用,也是关于声音的软件,我非常喜欢该应用的视觉界面设计,给人感觉很轻松、干净、素白与清静的感觉,产品本身针对的是一些高压和需要放松的人群,也希望给用户传达轻松、舒适、轻盈的感觉。
2.界面主要以卡片式的设计形式展示,主页面直接全屏场景的形式,沉浸感很强,界面也有很多细节,图标的底板利用的毛玻璃效果,图标则以线性展示,极简的设计风格,给人感觉通透与舒适视觉感受。
3.配色层面上,以留白的形式,颜色只是在界面作为点缀,每一个小的功能点都有对应的色彩,色彩上面在不同的色相情况下,保持了色彩的纯度和明度相差不大,产生整体配色一致性和视觉感保持一致,非常舒适。背景也带了S2的蓝色纯度在里面,相比于灰色显得更加丰富一些。
4.配图也找的非常符合产品的调性,每一张图和角度都通过设计师精心挑选和设计,每一张图的质量也很高。


5.闲鱼

视觉分析:
1.咸鱼app在视觉层面给我的感觉非常可爱、活力、年轻的气质,从咸鱼logo中就可以发现,整体的感觉是圆润、逗趣的。所以咸鱼的图标、按钮、头像等都是有圆的设计语言在里面,比如中间的加号图标底板,不是普通的圆角矩形,而是超椭圆矩形,非常有细节。包括每一个主要图标都是描边+填充的设计语言。
2.从咸鱼发现黄色的背景,也是我之前做错过的事情。在黄色背景不要用白色图标和白色文字,因为黄色明度比较高,白色在黄色背景上非常难识别,所以最好用黑色,这里也为什么咸鱼在黄色背景用黑色描边的icon,刚好也能很好识别。


6.爱彼迎

视觉分析:
1.爱彼迎是一款非常优秀的产品,有很多设计层面的东西都值得我们去学习。比如从产品的角度出发,首页的搜索房源功能卡片式在页面的展示层级上是最强的,视觉的感知也会比较明显,给予用户最好的视觉感知以及功能引导。
2.品牌色为红色,绿色、黄色为辅色,但是很多地方出现绿色显得非常高级,因为选用的绿色纯度比较高、明度比较低。红色与绿色形成互补,使得界面功能非常清晰与高效。
4.在一些数字字体选用也非常的细心,选用了一款比较粗壮的数字字体,从而在界面上用户易于识别,同时也赋予了产品独特的品牌特性。
5.图片的质量也是非常不错的,很少出现模糊、比较不适的图片,同时让整个产品的气质非常的有格调,更能让用户很好的体验该产品,整体的体验也非常的舒适、愉快。


7.Soul视觉分析:
1.Soul 也是比较火社交的app,不过玩Soul的时候发现他们的app还是有很多地方做的还是很不错的,底部导航利用的是船舵式,引导用户去“发布瞬间”。产品的整体图标都是以圆润的形式展示,绘制的也比较精致。
2.很有创意的点子是,用户发布瞬间的时候,底部有“soul拍相机、录制表情包、涂鸦表情”主要是图标还是以动态的形式出现,非常有趣。在社交类产品加入了涂鸦表情的点子还是挺不错的,赋予了用户更多创造的空间和想象力。
3.当用户在点击相册某个照片时,会有一个先缩小再放大的一个动效,一个小的反馈体验,大大提升用户的感知,还是挺不错的。


8.红板报视觉分析:
1.红板报作为新闻杂志类的app,在体验上和视觉上还是比较有意思的,当用户在首页切换的时候会像看杂志报纸一样翻页,非常新颖和有创意。
2.UI界面的图标、图片、用户头像一些按钮都是以直角的形式展示出来的,非常的硬朗,相当于提取了logo的设计语言,logo本身也是直角的设计语言。包括首页的页面的角标“封面故事”都进行精心设计过。标签像是正在翻页的效果。
3.配色上面也是以黑色和红色为主,整体的科技感、沉浸感也会很强,每一个页面都进行精心的设计过,非常值得学习的一款app。


9.东家

视觉分析:
1.东家app给我印象极深的是东家的icon设计,非常记忆深刻,甚至玩过之后不告诉我logo我都记得他们的设计风格,每个页面的图标都经过精心的设计,利用了宋体的笔画进行了图标设计,具有古朴、东方美学的韵味,连返回图标都是统一的设计语言,真的是绝了。
2.图标的设计刚刚好反应出东家的产品定位,本身也是一种传统工艺、茶叶、历史等买卖的app,赋予了产品传统的图标设计基因在里头,传达东方美学。
3.包括金刚区的图标设计利用了古代门窗提取了形在图标里头,配色上也是选择纯度、明度都比较适中的也是,显得整体会比较古朴的韵味。


总结:
每一款app都有自己的产品气质,就像每一个人一样都有自己的性格,每个企业也是一样,设计师需要不断发掘公司的产品气质,从而赋予到自己的产品中去,这样才能做出合适的设计。

希望自己发现的东西对大家有帮助,从而也能巩固自身的专业能力,感谢大家的阅读~


微信公众号:黄小伟UX

Powered by Froala Editor

更新:2021-05-09

收藏

4人已收藏

黄小伟

每天都要加油

  • 12

    作品

  • 137

    粉丝

  • 63

    关注

  • 3D主题设计!
  • 喜茶小程序产品设计体验分析
  • 爱彼迎产品设计体验分析
  • 韩国29CM产品设计语言分析
相关标签

    猜你喜欢

      2021-05-09 原创文章 经验/观点 举报 3327 4 7 0

      产品视觉探索

      0.0°

      你确定要举报产品视觉探索

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2021年05月09日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      7
      4
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录