专栏名称: 复利大王
分享和推送Java/Android方向的技术和文章,让你成为这方面的大牛,让你每天都成长一点。同时,我们也会邀请BAT的大牛分享原创!
目录
相关文章推荐
51好读  ›  专栏  ›  复利大王

如何开发和设计个人App——天气应用 Flat Weather 的设计历程

复利大王  · 公众号  · android  · 2017-03-03 10:07

正文

请到「今天看啥」查看全文


这个观念是相当重要的,在 App 设计中有两点需要照顾。

  • Clarity 清晰感

让用户能够在看见界面时第一眼就抓住主要内容,想一想 Google Glass,终结者系列,钢铁侠里面平视器的设计,即使看起来很复杂却能让人抓住主要的内容。

  • Clean 极简主义

个人认为是界面不能做的太花,就像 Google Material Design 一样,一个主色一个配色。

作为一个天气 App ,做到简约,不难,因为主要信息就是,天气状况 (晴天,多云) 和当时的温度两个点,所以要把这个信息突出来做到 Clarity。

这是整个应用一开始的设计,哈哈,是很简单,纯色背景,详细信息用白底,可是这未免也太简单了,需要好好改善一下。

所以我决定加入一些符合当时天气的插画。 使用扁平化风格设计。灵感来源一个是 Google Calender 中的插画,还有一个就是一款游戏, Alto's Adventure

是我很喜欢的一个扁平风格的游戏,虽然这个游戏类型是「 滑雪大冒险 」先提出的,但是这个游戏却超越了前驱。还有就是一个单机游戏, Firewatch (看火人)

分析一下每一张截图,整个画面很简洁,主色一般都是一个色系,使用一种颜色的不同深浅,和透明度来实现空间立体感。好了看着也不难画,自己试一试吧。

我用上面的风格试着画了几幅,感觉不错啊,比纯色背景提升了不少,但又不失简约,为了明确当时的温度,我在温度后面加上了一层阴影来和背景区分开。做了几幅效果图,感觉还不错,挺好看的,好了就这么定了,就这么设计吧。

接下来说一说我的设计工具。

Adobe illustrator

Adobe AI 是一个著名的矢量图绘制软件,我的设计中所有的扁平化插图都是由 AI 绘制的,其实我也没咋用过这个软件,下图是我第一次试手的时候画的,用了十几分钟。







请到「今天看啥」查看全文