
Design and Debug Efficiency
透過DDE系統,解決原本筆電製作過稱中,人員在線下溝通耗時過長的問題。併提供軟硬體設計資料的自動比對檢測,降低設計缺失,整合報告,減少RD debug 工時。
Team members
Wistron's User Experience Center
Project
Wistron Inc.
Device
Website

Background
電腦製造公司希望導入系統,來增進電路板設計流程的效率,快速除錯,節省人力時間成本。
Problem
從電路板的設計流程中,完全是 off-line溝通。電路板設計包含硬體設計和軟體設計,需要跨部門協作。但過去完全是靠信件、會議來溝通,當電路板設計出錯,軟體部門和硬體部門來回除錯時間可能會超過一個月。
Our Goal
設計一個專案資訊整合平台、包含除錯系統,讓所有部門的人都可以在平台上協作,快速找到問題,減少人為疏失。
Team
Working as a UX/UI Designer in this project
Product Owner
UIUX Designer
-
Interview with stakeholders
-
Design wireframes and user interface
-
Create design system
Scrum Master
Tech Leader
Tools
AdobeXD, Whimsical, Matomo Analytics.
Challenge
一個電腦代工的流程極其複雜,牽涉部門廣泛,其中包含軟體部門、硬體、Spec、PM、QA
管理階層等等,每個部門的需求。需要將多種複雜的需求整合在一個產品中。

Design Process
我們採取的是大型Scrum的開發手法,和兩個開發團隊同步進行開發,每兩個禮拜和PO一起寫制定目標。
在第一個 Sprint 開始之前,會先有設計師的 Prior Sprint,做前期研究和訪談,並和PO制定目標。
在 Sprint 開始之後,和PO討論並一起撰寫 User story,一週進行訪談和討論、一週進行原型的設計,在Implementation階段和Tech Lead 討論可行性,並在當週交付設計至RD團隊。


Interview
與相關部門代表及專家進行訪談,整理歸納他們的痛點。
依照需求製作flow和Wireframe,並與PO進行討論,討論過的Wireframe會再向核心使用者展示。
User Journey
任務流程:
1. 初版系統在創建新案件的時候,有些必填欄位提示不明顯,不知道如何完成開案流程。
2. 資訊顯示錯誤或系統顯示找不到資訊,使用者不知道如何修改。

Solution
1. 重新調整填寫順序和邏輯,先填寫必要資訊,並將步驟顯示於上方。並讓使用者可回到上一步修改。2.在填寫欄位加入提示和説明,並在錯誤資訊加入提示。
Stakeholder Map
為了在快節奏的 Scrum 解決龐大且複雜的需求,我設計了一個利害關係人地圖,區別使用者的重要性和對應的功能。

User flow
整個系統架構,包含不同的使用者使用該系統時會進行的大致流程。


Key Design
1.專案條列顯示:
一次瀏覽更多專案
2.視角切換:
根據登入的使用者部門,會顯示該部門對應的資訊,並可切換視角查看不同面向的資料
3.報告整合:
過去的資料都是碎片式 的分散在各部門。我們設計以QA的角度設計了一份整合報告,讓資訊一目瞭然。
4.除錯通知:
DDE系統會幫忙自動除錯,並通知相關人士,我設計了通知欄位、信件模板ㄑ


Wireframe & Prototype
用高仿真互動原型設計:
因為在敏捷開發中,每兩週就會進行一次設計迭代,需要快速交付設計 Spec 給RD。
在開發速度加快時,我省去 Wireframe 的製作,直接用高仿真原型進行設計,第一個好處是可以讓我的設計文件更接近已經在運作中的產品。
第二個好處是設計一旦確認後馬上就可以交付給開發團隊,省去從 Wireframe 再製作成原型的時間。
Usability
1. 建立測試環境:
我們的開發團隊製作了三個開發環境。開發環境、測試環境、和正式環境。
在給實際使用者使用前,我們會在測試環境讓潛在使用者試用,並從他們真實的回饋中進行調整,才會將完整個系統上架到正式環境。
2. 設計回饋系統
使用者可隨時透過回饋系統,回報系統的問題並進行評分。

Design System
我為 DDE 建立了設計系統,讓整個專案的元件都有保有視覺一致性。我為每個元件設計互動效果,並設計icon和插圖,讓RD和其他設計師都可以依循這個設計系統進行協作和開發。


Visual Style
For the visual aspect, I used a professional background of dark gray and complimented it with energetic yellow in this system. Then, I added a sense of speed to the logo design. Combined the circuit board with 0 and 1 representing software into the login page.


Impact
-
系統提供設計驗證串資料檢測、研發協作比對、進行資料彙整報告
-
優化RD研發溝通流程,每年可省下的人力換算為 0.7 Mn USD
-
上線後每月實際使用人數為349人,半數為硬體工程師,平均使用時間為11分40秒
-
使用者可對檢測結果做出回應,透過簽核流程修改結果,增強系統準確度
-
串接其他系統資料,快速瀏覽並線上編輯,減少使用者切換系統的認知負擔及溝通成本
What I Learned
1. Scrum的運作方式:
每兩週一次的Planning和迭代,讓我可以很快基於使用者真實的回饋來迭代產品,並更有效率的設計產品。
2. 大型的團隊溝通:
每週一次Retro,我們會和團隊成員檢討我們工作方式,讓我更暸解怎麼和不同背景的人溝通,並與他們建立良好的合作關係。
3. 設計以外的專業知識:
這個專案需要暸解產業相關知識,我們每週都會和領域專家開會。我蒐集了這些知識後建立了一個文件庫,以便暸解使用流程。