Don’t Make Me Think 書摘

06/21 | 使用者介面留言(0)

s4357645

第一次讀到這本關於使用者體驗的經典書籍大概是四年前的事了,當時看完後不知道借給了那位朋友,就再也沒有回來過了,日前逛三民書局的簡體中文館發現了新版的它,除了原有的內容還更新了例子,甚至還加上行動裝置體驗的章節,二話不說立刻敗入,為了以防那天又被人借走回不來,趕緊寫下文章備份。

 

本書分為四個大方向:

一、基本原則

二、網站導航系統的重要性

三、簡易使用性測試

四、行動體驗

以下就各章節做重點摘錄。

繼續閱讀

iPhone6 產品網頁設計缺失

09/10 | 使用者介面留言(0)

每天忍受著誘惑,不看任何的小道消息或是流出來的產品照片,就是為了等到正式發表會有驚喜的感覺。雖然我不是那種會熬夜看發表會的蘋果迷,但我的習慣是隔一天早,從官網來了解新產品的優勢跟特色,學習 Apple 是如何透過網站的設計來販售產品。

 

另一方面, Apple 新產品的頁面往往會採用許多最新的呈現技術,也會帶起網路業界的一股設計風潮。

 

今早第一次打開 Apple 網站是使用 iPad2,赫然發現整個網站改版了,拿掉所有的陰影跟漸層,朝 iOS 系統的平面化風格看齊。

 

apple-new-website

 

繼續閱讀

響應式網頁設計開發實戰 – 設計面

08/25 | 使用者介面留言(1)

本週進入響應式網頁設計主題的第三篇,前兩篇請參考

響應式網頁設計 – 響應式選單設計模式
響應式網頁設計開發實戰 – 企劃面

 

關於響應式網站的設計面,我想從設計師最常用的設計工具photoshop開始談起。

 

根本就沒有「網頁設計」軟體!?

開發網站的成員之中,企劃人員常用的工具是word、PowerPoint,進階一點的還會用到網站原型繪製軟體,像Axure rp;而工程師會用notepad++、visual studio、或是最近非常火紅的sublime text2

 

至於設計師,多半用photoshop做圖像與版面的設計,縱使是習慣用向量創作的設計師,最終也是要將圖像點陣化,才能在網頁上順利呈現,然而這些再平常不過的慣用工具,在響應式網頁設計中會碰到許多麻煩,最主要的原因是photoshop為平面設計工具,網頁與平面看似相同,但卻有著本質上的巨大差異。

01

 

繼續閱讀

響應式網頁設計 – 響應式選單設計模式

08/18 | 使用者介面留言(0)

responsiveNav-5

 

接續上週響應式網頁設計主題,本週將繼續探討在響應式網頁中導覽系統設計的模式,並分析其優缺點與適用情況,以快速應用於實際工作流程之中。

 

響應式選單設計的限制

有別於桌上型螢幕的大尺寸,手機的顯示空間往往不到其二分之一,雖然可以透過互動的方式來操作選單,但越高的互動性意謂著更高的使用門檻,在行動裝置使用普及率高的環境下,很難保證每一位使用者都有能力來進行操作,因此保持越簡單、越直觀的選單,才能確保更高的可用性。

 

其次是高互動性往往需要更複雜的程式來執行,對於網路速度較慢的且硬體等級較低的行動裝置會有難以操作的風險,因此響應式選單設計不宜過度參考手機原生應用程式(APP)的導覽模式,仍應就網頁的架構下進行思考。

繼續閱讀

變更基金投資標的轉換系統介面設計

11/12 | 使用者介面留言(0)

一般投資型保單均包含數十筆基金標的,因隨著投資績效的差異,或是國際市場的動向,投資人可自行選擇改變基金標的或是變更其分配比例,其中屬基金標的轉換流程較為繁瑣,為規畫該系統流程及介面設計,在此將設計過程予以紀錄。

投資標的轉換主要流程如下
選擇可變更之保單號碼。
檢視該保單所包含之基金標的,根據當日參考價值來進行轉出(賣出)之動作。
轉出(賣出)之金額需大於新台幣5,000元整。
轉出(賣出)之金額依照比例轉入(買進)新檔基金,或是就現有基金進行調整。
轉入(買進)新檔基金可依照基金公司下拉選單進行選取。
轉入(買進)新檔基金可依照基金代號選擇字母索引進行選取。
轉入(買進)之比例需為100%($5,000)。
確認轉入(買進)之基金標的。

介面設計過程

繼續閱讀

線上保單借款申請網站

11/09 | 使用者介面留言(0)
  • 日期:2010/10/15
  • 用途:提供線上辦理保單借款作業
  • 參與:系統操作流程規劃、視覺風格設計、介面設計、div/css
  • 說明:為方便用戶使用保單借款作業,製作線上借款專區進行借款操作。主要的設計重點在於流程的規劃,以及與程式設計溝通說明需求單位之想法,將其化作為圖像ddddd,並將操作介面視覺化,降低使用上之困難度,增加線上借款之可用性。

網站首頁
網站首頁

登入頁面
登入頁面

密碼變更
密碼變更

完成交易
完成交易

借款流程
借款流程

一淘網-提供完整購物搜尋體驗

10/20 | 使用者介面留言(0)

一淘網

今日從Inside看到這篇電子商務大比較?一淘網(etao.com) VS. PChome EC搜尋

看完之後覺得非常的開心,因為書中的理論真的有人把它實踐出來。

至於台灣的購物搜尋,使用上的體驗差了十萬八千里,先不提彙編詞彙的部份,在ec搜尋上找iphone4,結果要在第九筆才看的到!?

試回想才發現,以前在yahoo購物中心或拍賣也常常出現這樣的情況,現在才知道是因為根本就沒有做控制詞彙,以及對搜尋結果進行優化。

繼續閱讀

Android Slide Screen-視覺化資訊流桌面系統

10/14 | 使用者介面留言(0)

之前要換手機時總在考慮Android OS,絕對不是因為用過一陣子的tattoo覺得它好用而習慣它,純粹只是因為沒有足夠的銀彈去砸iphone,曾經去門市試玩過HTC的Legend、Desire,以及Samsung的i9000,說真的,要花這樣的價格去買這樣永遠看起來都卡卡的介面,還不如再多貼幾千塊去享受iphone的流暢,

或是只花個幾千塊來把玩一下android OS!?所以最後我敗了這一支TWM T1
twm t1

知道這支手機的人可能不多,當初續約加3990空機價入手,android 1.6,聽說和HTC Legend是同一顆CPU,在mobile01 actt大大等人的努力下,把這支絲毫不起眼的手機變成CP值超高的入門機種,甚至到後來小賣店還一度漲價兩到三成,現在因為T2出了,這支應該也已經停產了。

繼續閱讀