查看原文
其他

【案例解析】“看理想”-别致的人文阅读类应用UI设计鉴赏

静电 静Design 2022-07-13

据说点击蓝色字体关注同学都升职加薪了


静电说:emmm,看来咱们的案例解析栏目也要成为常规每周栏目啦。通过鉴赏设计出色的优秀APP,让各位同学有更好的观察能力和审美能力,从而促进大家设计水平的提升。


点击这里查看往期案例解析


那么本周,静电又发现了一款挺别致的应用,它叫做《看理想》,这是一款人文阅读类应用,风格独特,如果一定要用关键词形容,那应该是“文艺”。我们先定下基调和情绪,接下来咱们就一起看看。


启动引导采用了视频的方式进行,什么?你说你们不知道这里边的人是谁?这些都是应用中推荐的大师级人物哈。使用视频方式来展示,视觉冲击力非常足。



首页,首先说颜色,整个应用的颜色比较素,但又不是无色的感觉。而是低饱和度的颜色使用,让页面具有更强列的,深邃的气质。头部采用了标题文字+搜索框左右布局的形式,特性鲜明,如果你想你的应用更有特点的话,这种做法会挺不错的。


接下来,在所有应用都采用圆角表现的时候,这款应用采用了直角卡片+阴影的效果展示,更有特色。大能做好这样的设计也不容易,细节必须打磨到位才能出效果,比如左右留白等细节。


文字上,采用了Title文字(类)楷体的衬线文字+正文现代体文字的方式。用这样的文字来塑造风格,各位同学可以在一些偏文艺风格的应用上使用,非常有效果。



在理想家页面中,我们想谈的更多的是配图设计,每一张配图都是精心打造的,抽象化的配图,这让整个页面显得协调统一,所以,配图至关重要,每一张配图都应精挑细选。


另一个层面就是卡片的设计,在独立的卡片内部,使用了不同的颜色来呈现卡片内部的板块和层次感。比如“精选播单”栏目中的卡片,大家可以感受一下。



点击tab菜单中间的“看理想”按钮,则弹出菜单。个人认为这个交互需要好好考量一下,毕竟这种中部按钮点击后弹出的,建议不要用返回按钮而使用关闭按钮会更好一点。



下方的详情页设计也有很典型的平面设计特征,其实只要把握好版式,平面设计的一些思路完全可以用到屏幕上,只是我们需要更精心的雕琢而已。请注意标题的文字,同样是有气质的衬线字体。



每个应用都会有会员,这现在好像已经成为了一种约定俗成,仿佛不vip就啥也干不了。同样的卡片式设计,会员权益清清楚楚的用色块展示了出来,一点也不违和,上方的用户头像卡片采用了模糊毛玻璃效果展示,独特且具有很高的识别度。



下方的用户中心页面,布局上使用“理想家”这个色块banner将上下两个功能区区分开来,这是一种布局的小巧思。快快学起来。



关于页面,也是经过精心排版过的,虽然很少人回看,但是如果能发现这样的排版,也是一种惊喜。



最后来看看官网吧,官网也是这样的feel




总结:《看理想》这款应用充满了理想,也充满了文艺的气质,能发现这样一款独特气质的应用确实是惊喜,设计师在设计这类应用的时候要充分把我应用要传播的调性,将这种不流于世俗的独特气质做出来,这才是设计师深度思考能力的提现。


点击这里查看往期案例解析



更多精彩文章
我预判了你的预判?!如何设计更贴心的交互
超详细教程来啦!教你绘制轻拟物风格指南针图标
必装!推荐几个在Figma中做扭曲和3D效果的插件
本周精选优秀UI赏析-No.59(Behance长页面)
UI表单确认框如何设计?掌握这个诀窍直接搞定!
本周精选优秀UI作品赏析-No.57(Behance篇)
【案例分析】薄荷健康APP设计思路深入解析


《静电的UI设计教室-4月新课》来啦!
广受好评的全链路UI一对一小班课程
《静电的UI设计教室》已经举办了40多期
我们新的4月课程会在下个月中下旬开课
趁着大好春光 好好提升自己吧


↓↓长按二维码加静电老师咨询↓↓

您可能也对以下帖子感兴趣

文章有问题?点此查看未经处理的缓存