專案背景簡介 Project Brief

資訊種子培訓計畫致力於培育跨領域人才，而其官方網站作為重要的傳播媒介與報名管道，讓使用者能夠理解計畫並且有效吸引報名是其重要任務之一。有感於現有網站呈現的效果有限，我們便著手進行網站Redesign計畫。

專案成員

1 Designer 2 Front-end engineer 1 Back-end engineer

角色/項目

Designer：頁面架構規劃、設計完稿與交付、設計品管

專案時程

3 Months (ongoing)

設計挑戰

1. 需考量不同裝置的版面設計：

根據過往瀏覽量顯示，手機版與網站版均有一定的流量，
因此需要特別重視頁面RWD的表現。

2. 改動範圍龐大：

除了文字內容沒有太大的變化之外，所有版型、元件都需要重新設定，建立過去所沒有的系統。

專案心得

作為首個上線且獨立和工程師合作的作品，能夠將過去所學實際應用，內心得到不少成就感。網站將於近期改版完成，屆時還會與內容團隊討論後續發展方向以及提供建議，並且會追蹤新網站的流量數據，以便後續迭代，期待新網站的表現。

設計策略
Design Strategy

主要有兩個方面：

1. 以行銷漏斗作為設計原則，發展相應的設計策略，聚焦設計目標：

Aware：透過照片、明確的CTA以吸引用戶注意
Interest&Desire：思考潛在客群的需求，減少閱讀上的困難，並以簡明扼要的方式強調頁面重點
Action：吸引報名是網站的主要商業目標，在適當的區塊放上報名連結

行銷漏斗

2. 制定官網素材指南：

制定官網素材指南，提供多組Dos &Don’ts範例提供拍攝方向，便於維繫後續整體品質。
規範項目包括：色彩、人物、場景

官網素材指南

優化項目
Refinement

1. 資訊架構重整

・建立Sitemap, IA，釐清頁面間的關係，也便於討論與管理
・重整各頁面資訊呈現邏輯
・新增接觸點：針對各頁面新增CTA/入口，讓更多相關資訊/頁面有機會被觸及之外，也擴大用戶探索空間(下圖以首頁作為範例)

2. 設計系統建立

組建元件、定義色彩，保持整體網頁的一致性，同時達到減少開發成本的目的，以最小的成本達到最有效的成果

3. 透過真實照片強化品牌印象

有受訪者表示網站沒有畫面感，而資訊種子培訓計畫重於人才的培育，透過加入活動照片、歷屆學員照片，讓網站整體傳遞更多真實感，近一步提升信任感

ITSEED品牌官網Redesign

設計挑戰

專案心得

設計流程
Design Process

設計策略
Design Strategy

優化項目
Refinement

Sitemap/IA

UI Mockup

Design System /Guideline

其他專案
Other projects

ITSEED品牌官網Redesign

設計挑戰

專案心得

設計流程Design Process

設計策略Design Strategy

優化項目 Refinement

Sitemap/IA

UI Mockup

Design System /Guideline

其他專案 Other projects

設計流程
Design Process

設計策略
Design Strategy

優化項目
Refinement

其他專案
Other projects