Blog

因為蠻常在 GoodNotes 手寫日記畫 Wireframe，蠻喜歡這種手寫的時光。
在工作繁忙的時候靜下心手寫記錄心情、畫圖，這種時刻蠻好的。
所以在近期我用 Figma 做了一些 GoodNotes 的樣式。如果妳也有在用 GoodNotes 也可以下載後加到 GoodNotes 的 Template。

這次製作的料理，主要是使用原生的 CSS 變數 實做出深色模式和淺色模式的切換。除此之外，我們還會利用 HTML input 標籤當中的 checkbox 實做 『切換』這個動作，以下將介紹這些食材的特性。

這篇文章主要是分享之前公司收到六角學院的邀約，參與 F2E PK 賽 的參賽心得紀錄。PK 所製作的內容是『全台公車動態時刻查詢應用服務』活動的目標不是一個月內完成一個產品，而是透過活動練習不熟的技術和設計。而此篇文章將從 UI 設計角度，分享製作過程與收穫。對我來說正想要練習的是：使用者研究與訪談。

在前端切版時應該會很常遇到 UI Component 的困難，像是 Component 命名、撰寫方式、可擴充、可共用性等問題。

我雖然不是準 React 工程師，單純因為工作關係接觸了 Next.js 、 Tailwind CSS ，就此愛上這種以資料驅動樣式改變、建立組織、 Component 的方式。

前陣子筆者經歷了公司的品牌設計更新和公司網站設計的兩大專案，而這兩項專案也從一團雜亂的待辦清單到現在步入軌道，進行優化的階段。
以下，將主要分享網站設計的過程，一方面是紀錄，另一方面是想透過分享，回顧一下在執行設計的過程中有哪些部分是可以調整的。

筆者身為網頁設計師一半設計師、一半工程師，蠻多時候會花時間在設計稿與 CSS 樣式調整，以下我將分享工作中常用的小工具網站，減少設計稿和網頁切版的落差。

雖然筆者使用 Functional map 的次數不多，可能對於這個流程還不是很熟稔，也許尚有一些細節描述不是很完整，但以下我將分享在這個過程中獲得的一些體悟。

仰賴於網頁及科技應用發展，越來越多商品、服務都與網路、手機等接上，隨著這樣的發展很快的網頁設計、 APP UI 設計等也越受重視，為了讓使用者在體驗、摸索、認識網站或 APP 的過程感到有趣

為什麼會寫這篇文章呢？是因為筆者最近在 UI/UX Design 社團看到一篇發文討論，原文大致是一間公司的 PM 詢問社團內的人有沒有推薦的實體 UI 課程

筆者最近剛好有機會肩負幾個大專案進行，其中包含一塊設計這個部落格的前期規劃。在這過程當中學習到很多與人合作和專案規劃的細節。其中一些踩雷經驗分享給讀者。