iT邦幫忙

鐵人檔案

2019 iT 邦幫忙鐵人賽
回列表
Modern Web

前端「設計」聖光之路 系列

鐵人鍊成 | 共 30 篇文章 | 159 人訂閱 訂閱系列文
DAY 1

達標好文 為什麼要寫這篇系列文!?

我是卡斯伯,本身是設計出身,從高職 -> 大學 -> 研究所都是設計相關領域,出社會後從事網頁設計後來轉職為前端工程師。雖然主要工作是前端,但還是...

2018-10-15 ‧ 由 卡斯伯 分享
DAY 2

別使用平面繪圖軟體繪製 UI 設計

除了前端課程外,自己也是有辦一些額外的活動,而這些都會說到我是一名設計師轉職的前端工程師,除了介紹前端外,我也會介紹一些設計觀念。介紹時我大多都會使用 Sket...

2018-10-16 ‧ 由 卡斯伯 分享
DAY 3

設計師思維及工程師思維

我接觸設計的時間也非常長了,從大學、研究所到剛出社會,都是維持著設計的思維,直到開始認真學習 Sass、JavaScript 思維才慢慢偏向工程師(不得不說,...

2018-10-17 ‧ 由 卡斯伯 分享
DAY 4

網頁設計常用格線系統(上)

學習設計的時候,一定會討論到網格系統,透過網格可將圖片、文字做有條理的編排,只要有了網格做支撐,就算是複雜的圖文都會有規矩的排列。相反的,如果平面設計缺乏網格系...

2018-10-18 ‧ 由 卡斯伯 分享
DAY 5

網頁設計常用格線系統(下)

上一篇介紹了格線系統的概念及計算方式,擁有了這些觀念後會如何運用在繪圖軟體上呢?無論你是使用 Sketch 或是 Adobe XD 都可以快速建立如前文所提到的...

2018-10-19 ‧ 由 卡斯伯 分享
DAY 6

文件、規範參考 - Material Design

程式領域裡面非常重視文件,當然 UI 中也是如此,為了確保設計可以被執行,大型應用程式、系統都會推出屬於自己的規範,如: iOS 的 Human Interf...

2018-10-20 ‧ 由 卡斯伯 分享
DAY 7

網頁設計色彩配置概念

根據上一篇介紹的設計規範參考,實戰中有許多需要事先定義,而色彩是使用者打開網站最先體驗到的部分。好比說 Facebook 的深藍色、Google 的紅色、LIN...

2018-10-21 ‧ 由 卡斯伯 分享
DAY 8

你的網頁文字是否足夠清楚呢?

上一篇介紹了整體色彩選擇,按造該概念完成一個網頁相信不是什麼問題,不過色彩到底怎麼選?運用上有什麼需要注意的?本篇就來介紹一下吧。 Accessibility...

2018-10-22 ‧ 由 卡斯伯 分享
DAY 9

色彩運用(2) - 連結的配色

除了親和性的配色外,訊息的傳遞也是很重要的,與平面設計不同的是訊息並非只有圖文的傳遞,還包含了狀態、互動、提示等等訊息,訊息也同時可以用許多不同色彩表示,增加訊...

2018-10-23 ‧ 由 卡斯伯 分享
DAY 10

色彩運用(3) - 按鈕的配色

上一篇透過連結的狀態了解運用,本篇則是探討按鈕再運用上的色彩變化,包含了一般、行動呼籲、外框線、警告意味等常見的類型,當然這些類型介紹上別不會包含上一篇的 “狀...

2018-10-24 ‧ 由 卡斯伯 分享