鐵人檔案
本身是一名平面設計師轉職前端，過去參加鐵人賽都是程式相關主題；而這次回歸「設計」，透過這幾年來的程式經驗分享如何兼顧美感及可行性的網頁設計。
所以，這次的系列文會有助於具有設計相關經驗的工作者，進入此領域時可以注意到更多的細節，減少溝通上的磨擦；非相關領域者，也可以再這次的系列文章學習美感技巧，文中會介紹很多小撇步如：韻律、配色、格線等觀念，讓大家在設計上可以抓到簡單的準則。
我是卡斯伯，本身是設計出身，從高職 -> 大學 -> 研究所都是設計相關領域，出社會後從事網頁設計後來轉職為前端工程師。雖然主要工作是前端，但還是...
除了前端課程外，自己也是有辦一些額外的活動，而這些都會說到我是一名設計師轉職的前端工程師，除了介紹前端外，我也會介紹一些設計觀念。介紹時我大多都會使用 Sket...
我接觸設計的時間也非常長了，從大學、研究所到剛出社會，都是維持著設計的思維，直到開始認真學習 Sass、JavaScript 思維才慢慢偏向工程師（不得不說，...
學習設計的時候，一定會討論到網格系統，透過網格可將圖片、文字做有條理的編排，只要有了網格做支撐，就算是複雜的圖文都會有規矩的排列。相反的，如果平面設計缺乏網格系...
上一篇介紹了格線系統的概念及計算方式，擁有了這些觀念後會如何運用在繪圖軟體上呢？無論你是使用 Sketch 或是 Adobe XD 都可以快速建立如前文所提到的...
程式領域裡面非常重視文件，當然 UI 中也是如此，為了確保設計可以被執行，大型應用程式、系統都會推出屬於自己的規範，如： iOS 的 Human Interf...
根據上一篇介紹的設計規範參考，實戰中有許多需要事先定義，而色彩是使用者打開網站最先體驗到的部分。好比說 Facebook 的深藍色、Google 的紅色、LIN...
上一篇介紹了整體色彩選擇，按造該概念完成一個網頁相信不是什麼問題，不過色彩到底怎麼選？運用上有什麼需要注意的？本篇就來介紹一下吧。 Accessibility...
除了親和性的配色外，訊息的傳遞也是很重要的，與平面設計不同的是訊息並非只有圖文的傳遞，還包含了狀態、互動、提示等等訊息，訊息也同時可以用許多不同色彩表示，增加訊...
上一篇透過連結的狀態了解運用，本篇則是探討按鈕再運用上的色彩變化，包含了一般、行動呼籲、外框線、警告意味等常見的類型，當然這些類型介紹上別不會包含上一篇的 “狀...
