#網站UIUX #前端 #PM #獨立 #體貼 #認真 #效率 #理性兼感性 #換位思考 #深思熟慮  #同理心
LESS IS MORE
楊紫晴 Renee, Yang
網站設計 / 前端 / UI.UX / PM
四 年 品牌企業(B2B) . 網站視覺 / UI.UX
四 年 接案公司(B2C) . 網站前端 / 設計 / PM
亞洲大學 數位媒體設計學系畢
高雄人,定居新北新莊
1989.2.1.INFJ.顯示生產者
興趣: 心理學﹑烹飪 ﹑ MBTI﹑扭蛋﹑獨立樂團﹑新科技﹑大眾哲學﹑文字
休閒: Podcast﹑瀏覽多元觀點﹑閱讀﹑電影﹑
路跑
﹑散步﹑大眾動漫﹑遊戲﹑小酌

大小公司經歷,能獨立作業也能團隊合作

網站視覺設計
4 年 4 個月
圓展科技股份有限公司
B2B 自有品牌光電科技業.500人以上

B2B 品牌企業,獨立完成公司網站的改版及後續更新。同性質職位只有自己一位。
期間陸續加薪,獲提晉升一次。

  • 網站改版後,流量有顯著提升
  • 活動頁和登錄頁設計和改版,提高了轉化率
  • 三個事業部的產品頁設計
  • Banner、email banner、ICON 設計
  • 與資深工程師、PM、行銷團隊跨部門合作
  • 多語系官網圖片設計與維護
  • 圖庫和軟體續約管理
網站前端設計兼 PM
4 年 10 個月
雙欣科技有限公司
B2C 資訊系統服務(Apple 授權企業經銷商).1~30人

B2C 網站設計接案公司,未買圖庫,客製化不套版,專案流程完整。
同性質職位只有自己一位。獨立負責網站前端設計及客戶溝通。三年內加薪幅度達 75%。

  • 負責網站架構規劃、前端頁面設計和製作
  • 客戶需求討論與報價
  • 各類網站版面設計
  • 前端頁面製作切排版
  • 與後端工程師合作,確保前後端協調
  • 無障礙網站設計
  • 政府標案﹑專案文件撰寫 (包含時程預估)
  • 驗收、教育訓練安排
  • 互動問答遊戲製作 (Flash 現為 Animate)
  • 維護合約事宜處理
  • 網域申請、簡報製作、名片印刷輸出
  • APP UIUX 規劃設計
  • 網站內容維護

軟體與工具

Photoshop
Photoshop
illustrator
illustrator
Animate
Animate
Adobe XD
Adobe XD
VScode
VSCode
Figma
Figma
Chat GPT
Chat GPT
Claude
Claude

前端技能

HTML
HTML
CSS
CSS
SASS
SASS
RWD
RWD
JavaScript
JavaScript
Bootstrap
Booststrap

完整專案流程訓練,遵循 UI/UX 設計原則

設計規劃流程
  • 釐清使用客群與目標
  • 產品試用與賣點了解
  • 競品分析及資料蒐集
  • 清晰的架構規劃與資訊層級
  • 資訊化繁為簡,明確易懂
  • 素材收集與設計發想
  • 提供高擬真原型,體驗更直覺
  • 資料壓縮與 SEO 優化
遵循設計原則
  • 遵循使用者慣性規劃
  • 設計一致性,降低認知負荷
  • 直覺實用性,高於裝飾性
  • 遵循 UI 設計原則,提升易用性
  • 色彩心理學與完形心理學
  • 適當動畫效果,避免過度
  • 可互動元件,提供回饋提示
  • 留意 icon 的可辨識性
其他相關技能
  • 瀏覽器相容性問題解決
  • 無障礙網站設計與問題修正
  • 微動畫製作
  • 部分行銷概念
  • 印刷觀念
  • 文案撰寫
  • 電繪技術
  • AI 輔助(ChatGPT, Claude etc.)

設計不只是裝飾,更要好用

多數作品在設計規劃時都以下面幾個核心理念為原則

少即是多,適當留白,聚焦重點,呈現本質

如果頁面一次呈現的內容太多會分散注意力。著名案例如同 Google 搜尋引擎, 設計只集中在核心任務"搜尋"上,而不是像 Yahoo 奇摩把訪問者淹沒在可能並不需要的資訊裡。

使用適當且有意義的動態效果,不干擾體驗

適當的微動態可以增加好感,但如果動畫過長會讓人感到拖延,讓使用者失去耐心提高跳出率。 即便有些動態效果的確看起來很華麗,但不良的動態設計只是讓使用者從重要的資訊中分心。

遵循使用習慣,直覺明確,而非盲目創新

過度複雜或不符合使用者習慣的創新,反而可能讓使用者困惑。因此我認為網站設計應該要遵循通用設計準則,確保操作直覺、簡單易用,而不是一味追求創新。

使用者會來到網站都是有他們的目的

使用者來網站不外乎是找尋他需要的資訊,因此設計的首要目標是幫助使用者快速找到所需內容,再來才是美化為良好體驗加分,而不是過度裝飾。

特質與實例

獨立、有自學力、會找方法增進做事效率

  • 待過的公司共通點是同性質職位只有我一個,沒相關前輩或主管帶,很多事靠自己摸索學習
  • 前端切排版 HTML﹑CSS 皆是在家上網自學
  • 當初因標案要求一定要使用 Bootstrap & RWD 製作網站,即刻上網自學並在期限內順利驗收
  • 自學 Js 框架套用及運用;後上線上課程及 AI 教練輔助學習 Sass﹑Vue﹑React 等運用
  • 休息期間自學股票投資,自己用 excel 公式自動帶資料,做了一個股價區間觀察追蹤表,省時便利
  • 單親經歷,從小獨立自主、自律,很多事能自行解決

體貼擅理解傾聽、有同理心、能換位思考

  • 曾被主管評過體貼、理解力良好;也曾被合作窗口稱讚都能理解提出的需求並修正
  • 自知身為前端時間管控很重要,重視合作夥伴時間分配,會留意後續工程師作業時間
  • 搭高鐵下車時會記得收起椅背,讓後座的人也方便下車

重視事前溝通,善於洞察使用者需求、溝通富彈性

  • 重視執行前的溝通,進行充分討論再設計,節省因誤解帶來的非必要調整,不浪費彼此時間
  • 通常修改往返一次完成。即便使用者不知想要的是什麼,也能盡量釐清方向,減少浪費彼此時間
  • 清楚合理的調整建議,不太會固執己見

認真負責、積極主動、解決問題為優先

  • 不太需主管督促進度,從前做專案也幾乎很少延遲
  • 盡量謹慎不出錯,萬一有錯會立即反應上級,想辦法先改進及並以解決問題為優先
  • 曾負責公司所有合約、網域管理與追蹤,沒建系統,自己注意續約期限,不需公司督促與提醒
Thank you for your time.