LINE 諮詢
UX / UI Design — Taiwan

讓複雜的操作流程,
變成更直覺的使用體驗。

專注後台管理系統、電商介面與操作流程優化。從盤點使用者實際怎麼操作開始, 把散落各處的資訊重新整理成清楚、好懂、不用教就會用的介面。

服務範圍 後台管理系統電商介面表單與結帳流程RWD 改版

設計師在辦公桌前使用電腦,螢幕上是介面設計稿
Services

服務項目

正在規劃網站、後台系統或介面優化?下面是我實際交付的內容。

在筆電上調整介面的版面與元件配置

UX/UI 設計

先分析使用情境與操作路徑,找出流程裡真正卡住人的地方;再優化版面配置、元件與視覺層級,讓介面好讀、一致,也方便工程師實作。

交付內容
  • Figma 設計稿
  • 元件庫 Components
  • 標註規格 Spec
  • 切版素材
網站資訊架構圖,顯示頁面分類與階層關係

使用者操作流程

重新整理內容分類與資訊層級,建立清楚的導覽結構(sitemap)。適合功能長期疊加、選單越來越深、新人要教很久才會用的後台系統。

交付內容
  • Sitemap
  • User Flow 流程圖
  • 權限與角色對照
  • 欄位盤點表
從上方俯視的工作桌,筆電上顯示線框稿

Wireframe 線框稿

依照操作流程先畫出低擬真線框稿,把版面與資訊順序快速攤開來討論。在進視覺設計前就對齊方向,能省下最多的來回修改。

交付內容
  • 低擬真線框稿
  • 頁面清單
  • 互動說明
  • 可點擊原型
手機版介面設計稿,顯示為小螢幕重新安排的版面

RWD 響應式設計

依桌機、平板與手機的實際使用情境,分別規劃適合的版面,而不是把桌機版直接縮小。後台的表格與大量表單在手機上特別需要重新安排。

交付內容
  • 375 / 768 / 1440 三版設計
  • 斷點規則
  • 表格折疊方案
Process

合作流程

從第一次聊到交付,大致會經過這五個階段。時程會依專案規模調整。

免費諮詢

約 30 分鐘 · 免費

用 LINE 或線上會議聊你目前的狀況、想解決什麼。不收費,也不需要先準備需求文件。

需求確認與報價

約 3–5 個工作日

整理出頁面範圍、交付項目與時程,提供明確報價。確認後簽約並收訂金。

流程與 Wireframe

約 5 個工作日

盤點現有資訊與操作路徑,產出 sitemap 與線框稿,先把版面與資訊順序定下來。

視覺設計

含修改共約 20 個工作日

完成視覺設計與元件規範,同時處理桌機、平板、手機三種版本。含 2 次修改。

交付與後續調整

交付後 2 天內可免費微調

交付 Figma 檔、標註規格與切版素材,並配合工程師說明實作細節。

Selected Work

案例

每個案子都從「原本卡在哪裡」開始說明,而不只是放最後的畫面。

E-commerce

電商網站:結帳流程與內容管理優化

電商結帳頁面設計,左側為登入與註冊會員,右側顯示訂單內容
結帳頁面
活動企劃頁面設計,以卡片呈現活動圖片、日期與說明
活動企劃頁面
問題
結帳手續繁瑣,使用者要在多個步驟間填寫資料,容易在過程中放棄,影響成交率;商品與文章的更新步驟也繁瑣,新訂單不容易即時發現。
做法
把結帳整理成四個單向前進的步驟:選擇商品 → 付款/登入會員 → 出貨資料 → 確認訂單,並提供未註冊會員結帳等選項;同時整理商品與文章的編輯流程,讓內容可以簡單更新,並加入新訂單的即時 Email 通知。
成果
簡化結帳手續,提升成交率。 例如開放未註冊會員結帳、可設定結帳選項;商品與文章都能簡單更新,有新訂單時即時 Email 通知。

需求:UX 流程規劃 · 資訊架構 · 介面設計 · RWD | 時間:約 30 個工作日

結帳流程 選擇商品 付款 / 登入會員 出貨資料 確認訂單 STEP 1 STEP 2 STEP 3 STEP 4 未註冊會員也能結帳 · 結帳選項可設定
上面那個案子的結帳流程:選擇商品、付款或登入會員、出貨資料、確認訂單, 四個步驟單向前進,並提供未註冊會員結帳等選項,減少結帳時的手續。
Admin / Booking

空間預約系統:後台管理與官網規劃

運動空間租借管理系統首頁,顯示今日預約、場地使用狀況與系統通知
後台首頁
場地狀態管理頁面,以色塊顯示各教室今日的使用狀態
場地狀態管理
問題
後台功能長期疊加,選單層級越來越深,管理者要在三個頁面之間切換才能確認一筆預約狀態,新人上手需要專人帶;官網首頁則把資訊平鋪在同一層,訪客看完不知道下一步該做什麼,聯絡入口也藏在頁尾。
做法
重建後台的資訊架構與導覽,把同一筆預約需要的資訊集中到單一頁面,用狀態標籤讓待處理的項目一眼看得出來;官網則依訪客的決策順序重排區塊,每一段只回答一個問題,並把聯絡動作放在每個段落的結尾。
成果
新人容易上手、操作直觀,並有即時通知。

需求:資訊架構 · 內容架構 · 介面設計 | 時間:約 30 個工作日

Lirea Studio 莉芮亞數位工作室標誌 Lirea Studio 莉芮亞數位工作室標誌
About

關於 Lirea Studio

我從使用者的需求與實際操作情境出發,重新整理複雜的資訊與流程,讓產品變得更清楚、更直覺,也更容易上手。

目前主要投入後台管理系統、電商介面與操作流程相關的設計與優化。這類系統的共同點是功能多、使用者是每天都要用它工作的人,所以「少按一次」「不用回頭改」帶來的差別,遠比畫面好看更重要。

我想做的事情很簡單:透過設計,讓不好理解的事情變得簡單一點。

專長領域
後台系統 · 電商介面 · 一頁式網站
常用工具
Figma · FigJam
服務地區
台灣(可遠端)
接案狀態
目前可接案
FAQ

常見問題

找不到答案的話,直接用 LINE 問我最快。

費用怎麼計算?大概的預算範圍是多少?

依頁面數量、功能複雜度與交付項目報價,確認範圍後給固定價,不採計時制,你不會收到超出預期的帳單。

單頁式 Landing Page 設計:NT$10,000 起
品牌/形象網站首頁設計:NT$12,000 起
電商/購物設計:NT$8,000 起
後台管理系統:NT$10,000 起

一個專案大概需要多久?

單頁式網站與後台系統改版,各約 15 個工作日。實際時程取決於你這邊回饋與確認的速度,這通常比設計本身更影響總長度。

我沒有設計稿也沒有需求文件,可以先聊嗎?

可以,而且這是最常見的起點。你只要能說出「現在哪裡讓你覺得不順」就夠了,需求整理本來就是我的工作之一。

只做設計,還是也包含前端切版?

我專注在 UX/UI 設計與流程規劃,交付 Figma 設計稿、標註規格與切版素材,並配合你的工程師說明實作細節。目前不提供切版(前端開發)服務。

只有介面要調整,沒有要整站改版,也接嗎?

接。局部的流程優化通常投報率最高 —— 例如只重做結帳流程或一張關鍵表單,不必動到整站就能看到明顯改善。

設計稿可以修改幾次?

報價包含 2 次修改。因為在進視覺設計之前,我們已經先用線框稿對齊過版面與資訊順序,到視覺階段通常不會有大幅度的翻案。

Contact

聊聊你的需求

第一次諮詢免費,不需要先準備好文件。

送出後我會在 1–2 個工作日內回覆。你的資料只用於這次聯絡,不會提供給第三方。

LINE 官方帳號 最快 @949lhpbu Email xuyan830802@lireastudio.com
回覆時間平日 1–2 個工作日
服務地區台灣 · 可全程遠端