Day 18 prototype 配色与精稿绘制

来找设计师一起 side project,前後端 / UIUX 皆可ㄛ。配对单连结:
https://docs.google.com/spreadsheets/d/1-6YCUfqaB7dQLQa34pbuCHgYvXU3eYZ0dvDcPszhE4g/edit?usp=sharing


印度气象局官网:https://mausam.imd.gov.in/#.

prototype 大家自己玩玩看,应该会每天更新ㄅ:
https://xd.adobe.com/view/bd7fd57a-8e2f-44b0-bc26-322e98708133-e82c/


哈罗大家晚安,今天居然差点忘记写铁人赛,吓死我,赶快将我的印度气象局拿出来弄点颜色。

上次的 wireframe 可以自己去看前一篇,大抵来说就是黑白的线稿。
所以呢,我们就今天要来配一点颜色给他,让他 blingbling 。
然後设计感啥的绝不可能,就别想太多,我觉得这种资讯型网站简单明了就很好了。

主色

我只选了三个颜色,重蓝色、浅蓝色、黄色,顶多加上红色的警告 icon,不过主要就是 3 个为主。黄+蓝我觉得是一个非常适合科技业的配色,会显示出精致高级但又充满科技感。

(ps. 你看到的所有色票是本来官网的所有颜色)

蓝为主,配点黄色

所以当他 hover 的时候就会是出现黄色了,啊啊好美,但我没有每个按钮都做,太累了呜呜。

加上黄色辅色给他一点表头设计看起来就完美多了

大城市+自订天气+新闻区块

大城市天气的这一块是用淡蓝色的底,底是使用次要的蓝色降低透明度,重蓝色去压。

然後去 YouTube 截了一张他们的可爱播报员,做了一个按钮给他播报。

底下新闻就随意了,从好用的图库网站找了 4 张印度的图片。

https://o-dan.net/en/

加上天气标示

搞定nav sidebar同时顺便给这个地图加上昨天懒得加的天气标示。

LOGO 部分

我选择了气象局原本的Logo,他的另外一个Logo其实是印度,那个我应该会放在 footer 或是直接拿掉。

他原本的设计是长这样,但看起来有点局促,所以我这样他上面的那部分放到旁边,然後把它塞回去。

应该是可以重新设计啦但我很懒

整体

今天大概这样子,明天请了一天特休要来开开心心的搞履历了。

最近好多人要离职,报复离职潮吗,好害怕。


<<:  [Day 28] Leetcode 78. Subsets (C++)

>>:  Day19 Vue元件的命名规则 & 单一元件(SFC)

[DAY 17]Discord server串接webhook

最近有打算写一个功能 FF14官网有新消息发布,bot就会把消息发送到discord主频上 但後来发...

认识HTML(六):表格与表单

基本的表格构成 在HTML中的表格结构是以列及栏位定义出来的。 表格会用到以下三个元素:table、...

如果你对Microsoft 认证感兴趣

首先感谢这个技术平台让我分享一些专业的东西,今天我会分享一些Microsoft exam certi...

Day24:今天我们来聊一下Azure Sentinel中使用的关注清单

Azure Sentinel提供资料表来储存可供Kusto查询语言(KQL)查询存取的清单资料。 A...

Day7:K-means分析

  K-means的中文有人称作集群分析,但是主要都还是讲英文,比较容易懂。   这分析方法跟KNN...