[介面設計]Dolphin Browser IPHONE版心得

是的，我最喜歡的手機瀏覽器是IOS版本的Dolphin. 不過事先澄清一下，雖說我最喜歡DOLPHIN，但是我用最多的卻是CHROME。在這邊扼要的列出我最喜歡的幾個特點:

1.大拇指Sweet Spot的妥善利用:最重要也最讓我喜歡的是，工具列在下方。而且某些項目也可以經由按下右邊數第二個的按鈕來彈出很像2.X ANDROID選項列。而這種底部彈出的選項，非常適合手指觸及。

2.螢幕左右兩側皆能滑出不同的選單。這個FACEBOOK跟其他一些APP都有導入使用。不過我喜歡的莫過於螢幕右側滑進後開啟的"分頁列表"。這個我覺得比CHROME或者Safari的分頁方式來的好用，而BLACKBERRY 10的瀏覽器似乎也導入了類似的介面，不過BB10的分頁是在畫面左緣。

3.可開啟的自動全螢幕模式:看到這個選項我笑出來了，一方面佩服著Dolphin的細心，一方面也覺得我的想法真的有人認同。記得我在上一篇討論隱藏式的工具時提到，就GOOGLE+來說，我寧可隱藏的是標題列，而不是工具列。我發現Dolphin所使用方式就是不隱藏下方工具列，只隱藏上方的網址列。而自動全螢幕模式開啟後，就會"強制也把下方工具列隱藏"了，對於需要更大的閱讀空間的人來說，開啟這個選項會得到類似PINTEREST的全螢幕瀏覽體驗。

不過這種列表方式，就沒法像CHROME或Safari一樣可以看到整頁的螢幕縮圖了。所以! 歸納一下，不知道是否可以滑開後，看到的是CHROME風格的卡片堆疊方式?:)

Chrome IOS 的分頁

小缺點:就是左上角跟右上角的兩個按鈕，行為不一致。左上角的書籤按鈕按下後，對應的其實就是螢幕左緣滑進後拉開的書籤列表。那麼照理說，右上角的按鈕應該就是對應螢幕右側畫進後拉開的已開啟的分頁列表。可惜事實上不是這樣。右上角的按鈕很弔詭的是HOME鍵...我覺得應該有更好的配置方式。

[介面設計]增加閱讀空間: 往下捲動才會出現的工具列

其實是手指往上滑，文章是往下捲，這時需要最大閱讀空間，所以隱藏工具列。

這樣的設計，可以在GOOGLE PLUS看到，當然還有很多其他的APP也有這麼作。說真的，我第一次看到的時候非常不習慣，因為我直覺上不認為"呼叫工具列"這個動作，是用手指往下拉來呼叫，尤其是在螢幕下緣的工作列，更讓我有種方向相反的錯愕感。硬要說，就是第一人稱射擊遊戲，滑鼠往下但是其實是視點往上那種感覺。

而對手的FACEBOOK，也是大同小異，不隱藏標題列，但是發文等等的按鈕工具，是放在上方，位於標題列底下。不過就我對於觸控熱區，也就是大拇指的SWEET SPOT來看，放在上面實在不太好用。不過，文章往上PAN的時候感覺像是工具列也跟著被捲上去了，反而比較沒有我剛剛提及的反向違和感。滿有趣的。

可是當同時又有"新動態"時，FB就呈現了非常肥厚，讓我想到培根的三層結構。

回頭想一下，我個人最早接觸到這個操作邏輯是在PINTEREST上面，這邊特別想提出來的是，PINTEREST更直接把上方的標題列也隱藏了，整個讓文章內容得到最大的呈現。

那麼GOOGLE+究竟為什麼還要保留TITLE BAR呢?這說來我也不知道，若要我瞎猜，我會說各家權重各種按鈕的比例不一樣吧...那真要我說，我寧可隱藏工具而保留底下發文的各種按鈕呢，哈

先跳脫出上述這種操作邏輯。來看看其他還有甚麼類似的"文章內容優先"的APP，而他們又用甚麼樣的方法來取得最大閱讀空間?

其實我個人比較習慣的是類似ADOBE READER APP的操作方式。輕觸螢幕中央就可以隱藏/顯示上下方的工具列。

值得提出的是，READER跟KINDLE都是純文字居多的內容(正常來說)，PINTEREST跟GOOGL+則是類似卡片式的區塊，文圖摻雜。而且這兩個APP需要用輕觸來進到下一層。所以避開用點擊來隱藏工具列頗為合理呢。

不過KINDLE跟READER這樣的做法，很適合需要一直不斷上下滾動來閱讀的狀況;"因為工具列不會一直探頭探腦"。而我有時候也會覺得FB或G+的工具列探頭探腦很煩，PINTEREST更是常常被我快速上下滾動，我其實不太希望一直看到若隱若現的工具列。因為對我來說，閱讀不單純是一直往下滾動，尤其是社交網路APP。

這邊列舉這兩種現象，也許看起來微不足到，對我\卻是很有趣的紀錄。那麼，是不是還有甚麼方法，可以在這兩個方法中間，在取得一個平衡?

[閱讀心得]關於APPLE以及GOOGLE的介面設計風格

今天讀到3篇我很喜歡的文章，在這邊推薦給各位，也給自己做個閱讀後的心得總結。

Google finds its design voice on iOS

12.25.2012補充，今天看到數位時代翻譯版(:請點這裡


延伸閱讀:
Apple's 6 Simple Rules for Designing a Killer iOS App
10 experience-enhancing tips for iOS app success

再延伸閱讀:
Google Maps mobile lead: We had to crawl before we could walk in app design (interview) 

說來有趣，這三篇文章雖然並不全然相關，可是其中探討的東西，卻又有重疊的部分。而那個交疊，就是APPLE的設計哲學。第一篇非常精彩，而我這篇心得主要是以這篇文章的讀後心得為主，其餘兩篇則是可以拿來作延伸閱讀的文章。最後一篇則是最近大紅的GOOGLE MAPS FOR IOS的LEAD談論該APP的開發， 也非常值得一讀。

總和來說，APPLE一直提倡著所謂的仿真設計，或者說復古設計，相關的討論我以前也有提過。而GOOGLE走的是完全不一樣的方向。APPLE使用仿真設計的理由，不外乎"經由對於現實世界的模擬，來增進使用者對介面操作的親和與熟悉"。然而這引起很大廣泛的爭議。爭議的點可以看看其他的文章。

我很高興GOOGLE即使在IOS上，也沒有被牽著設計的鼻子跑。主導Gmail iOS專案的總設計師Jason Cornwell英文原文中有一句話我在此引用:
Cornwell specifically calls out the fact that it’s doing things that feel ‘digital’, rather than physical."  
“What we’re shooting for here is something that feels authentic and digital, that isn’t trying to be a physical thing. But at the same time has some depth to it,” he says. “When you start to interact with it, you get a sense of sophistication, that there’s a lot there, but the initial presentation is very simple and very clean.”

可以看出，GOOGLE的設計師，希望使用者感受到的是"數位"，而非"實體"。而且是用非常簡潔的手法來呈現。這也是我喜歡GOOGLE，或者舉例來說Any.Do的設計風格。因為我一直認為這些APP介面設計，真的是在一個DIGITAL的螢幕上發生的，若是要借重實體的使用經驗，反而會造成數位，甚至說MOBILE的使用行為的衝突。而在圖像上，有時也會造成畫面過於繁複而失去焦點，尤其是在小螢幕的手持裝置上，不過這也是我個人的美感觀點來論述的。我一直覺的"與實體物品"的連結，應該更隱晦而巧妙的，而不是大辣辣的把東西畫進UI中。

而新的GMAIL也是經由整合了併購了Sparrow團隊而可以看到很多Sparrow App的點子。包含使用大大的首寫字體以及個人頭像。

各位可以讀讀Apple's 6 Simple Rules for Designing a Killer iOS App，這篇Spun App 團隊跟APPLE合作後寫的心得，多是來自於APPLE給他們的設計指導。其中第一點就說"The App Should Feel Like a Tangible Object"，也就是強調APP用起來要像是一個實體。Spun的設計師於是作了一個住狀介面，並說明他的設計理念。  但是說真的，DUDE，這個介面的風格既不吸引，也沒有任何USABILITY的好用之處，我覺得很像HTC的翻頁特效。我個人也覺得這個就是太強調實體意象而犯的錯誤。

而另一個更容易犯的錯誤就是像APPLE一樣去直接把瑞士鐘畫進UI...這又是另一個故事了。

[Android]Google Search App: Search by Camera

今天GOOGLE公告了兩隻新的廣告，其中有一隻展現了一個用相機來搜尋的功能。這是最新的ANDROID版本的GOOGLE SEARCH APP才有的功能。其實說真的，我一直覺的GOOGLE沒有把GOOGLE SEARCH這個BRAND定位清楚....而在ANDROID手機上，這功能已經跟"從軟體鍵列"往上拖後呼叫出的GOOGLE NOW結合了。跟IOS上面開啟一樣為GOOGLE SEARCH APP看到的完全不同。

一開始我還找不到這功能，不過依照慣例，把語言改成老美就沒問題了。可以在GOOGLE NOW的介面底下，按下OPTION的ICON，就可以看到SEARCH BY CAMERA了。其實我不是很喜歡把功能作的這麼隱晦，應該在外面放一個按鈕可以快速啟動。不過猜想是這功能其實還是沒有很完善吧，等過一陣子應該會有獨立的按鈕。

恩，如果對GOOGLE產品有一定熟悉程度的人一定會發現，"!!這不是之前的GOOGLE GOGGLE嗎?" 我想也是，不過以前GOGGLE實在是不怎麼好用，介面也很糟糕，如果手邊有IPHONE的人可以開啟GOOGLE SEARCH APP，然後在SETTINGS中，勾選使用GOGGLE，就可以在開啟GOOGLE SEARCH APP後，在右下角看到一個GOGGLE的按鈕了。

回到ANDROID，開啟SEARCH BY CAMERA後，可以看到如同廣告中一樣嶄新的介面了。我很喜歡喔~中間的FOCUS延用了4.2相機的圓形鎖定圖型風格，不過比較細。而拍照鈕則是非常方便右撇子大拇指使用的放在右下角，這我也很欣賞，不要每次都把拍照鈕放置中! ^^

而在圓形的中央，可以看到很像魔法特效一樣閃爍的光點，我還真是頭一次看到這種特效用在相機對焦的地方。把圓圈對準想要搜尋的物品，等待一下，可以看到焦距會校準，如果有辨識成功的話，圓圈會變成半透明的白色，此時趕快按下快門鈕，就會列出搜尋結果了。

不過我測試的結果，這功能居然認不出我的IPHONE....不過倒是可以認出面速力達姆^^，我也拿來對著網路電視頻道搜尋了一下影集封面，沒想到好漢兩個半，綠箭俠等等都可以辨識出來~真有趣^^還有ASAHI出的十六茶也找的到。但是說真的，對了很多東西都無法識別，也許是我哪裏操作不好也不一定。

此外，介面的右上角，有一個閃光燈標記，可以用來開關閃光燈。

若是你問我說，那還沒出現白色半透明就按下快門會怎樣?其實我測試的結果，這麼作有時可以辨識有時候又不行，到底甚麼機制我還看不出來...

那GOOGLE GOGGLES還存在ANDROID上嗎?答案是還在喔!有自己獨立的APP跟UI風格，但是IOS上則是整併到GOOGLE SEARCH APP裡面了。我猜ANROID終究會整併吧，不然BRANDING實在是太紊亂了。

不過就我個人的測試，用GOGGLES來搜尋出來的結果，跟在啟用GOOGLE NOW的SEARCH BY CAMERA的結果不盡相同，為什麼我也不曉得。

馬後炮設計師?我記錄一下我一年前的構想

最近整理文章的時候很感慨，因為一年多前的提案，似乎慢慢部分被印證了。

之前提出"不要特定鎖屏畫面"，被打槍。但是我還是覺得這一定會慢慢發生的。從BB10的鎖屏就可以看出我的想法並不算太孤單。我的理論是，其實我們不需要目前這種鎖屏: IOS的一個大電池+時鐘

可是被反對的原因包括甚麼隱私性問題的...我坦白問問各位，以前舊時代，手機鎖屏你看到的是甚麼畫面呢??這跟隱私權有甚麼關係

我提出的是所謂的"隱性鎖屏"`,也就是使用者看到的還是原來的桌面，也可以PAN`,因為PAN並不影響手機解鎖的問題

而我希望的設計是，使用者可以"任意LAUCH 每個APP"一邊解鎖

而在PAN的同時，如果ICON還有像動態磚一樣的更新功能`,那這樣的鎖屏狀態能顯示的資訊就遠多於目前任何一種手機提供的了....

之前也提過，鎖屏畫面可以做很多事情，若要鎖屏，其實可以在鎖屏畫面作很多事情。GOOGLE在4.2也作了很陽春的示範了，我提案的也沒錯,不過我當初更進一步想要說，像是地圖導航這種可以開放成鎖屏也能使用的設計，應該要像MUSIC PLAYER一樣被開放出來的。我希望以後有手機能驗證我的想法。

我討厭當馬後砲設計師，但是卻沒有甚麼地方可以真的去實踐一個構思

[介面設計]IOS Google+ 新介面設計感想

這次GOOGLE一口氣推出也更新了很多IOS版本的G家族服務，其中我用最多也最喜歡的G+整個介面大翻新。有很多有趣的細節跟邏輯，這邊就稍微記錄一下我喜歡的部分，如果各位看過就請忍耐下，然後再看一遍 XD

1.必須先按+1，才會出現分享按鈕
   這是我無意間觀察到的，覺得很有趣，也很有RD的哲學在裡面。
   "你必須覺得讚，才會分享"...似乎說的通咧!

2.留言跑馬燈:
   這真的太有趣了，在每一則分享底下會有一欄顯示最新三個留言的跑馬燈，
   有一個會不斷平移的小三角型，指向發言人的大頭照縮圖

3.撰寫發言的新邏輯:
   填寫文章欄位在上，底下有所在地，然後才是像機，相片跟連結的按鈕
   說真的，寫到這邊我已經忘記舊版的是怎樣了，似乎之前的版本沒有"連結"這個按鈕
   不過目前看來，分享照片變得很容易，對照ANDROID的版本，IOS版本的G+
   直接把像機跟相片兩個作成獨立按鈕，我覺得很方便
   而且若是選擇"相片"，進去後還是可以看到"相機"跟"相機膠卷"兩個放在最前面的按鈕，
   方便使用者切換，很棒!

4."撰寫"的按鈕放到螢幕右下角了，進入右撇子大姆指最喜歡的熱區~
    比起之前在右上角好太多了!而分享照片，簽到，跟分享連結也跟撰寫放在同一排工具列上
    比前一版只有孤單的撰寫按鈕來的更便利
    當然，很多人會說，阿這四棵按鈕按下去還不是都到差不多的頁面，但其實
    已經幫使用者省下"1"個步驟，這在UX來說是很重要的....我覺得

5.分享照片還可以先看到照片預覽，也可以直接刪除照片，比起前一版更直覺喔

這幾個是我最喜歡的更新，當然還有很多小細節，不過我就略過了

從蘋果的隱藏式的SCROLL BAR專利談一種態度

這裡刊登了一個APPLE取得重要的UI專利了。

說起來這真的是一個在大家的眼裡很沒有價值的一個專利:

在滑動手機內容的時候，會出現一個捲動軸，然後消失
讓使用者知道目前的CONTENT的位置

如果在公司提出申請這樣的專利
應該只會被專利委員打槍槍
說...沒有實用價值
會被認為這是很.....稱不上發明的發明
充其量只是一個"美術特效'

然而其實這專利一通過，媒體都是說會造成ANDROID或者其他手機的專利問題
想想也是,這個"發明"已經無所不在了

因為他其實增加了屏幕上的可視範圍，巧妙的暗示出內容的位置與多寡。

但是說真的，對很多人來說，這個捲軸其實真的很沒用，應該說不夠有用
因為有時候我們還是很想要精確的控制內容的位置...

但是總歸來說，其實這是一個很有"申請價值"的專利，因為他解決了"小螢幕上衍生的一些問題"

我覺得我最鬱悶的是，其實台灣公司都很不注重專利的
即使注重，也對於GUI或者UX這一類的專利很沒有SENSE的
所謂沒有SENSE，是指看不到也不願意投資這些技術
因為從RD跟生產來說，實質的產值真的很無感。

說真的，身為UX或者GUI人員，我們自己也很難說服我們自己某個東西是不是真有價值

而不管怎樣，相較於APPLE居然願意，從2007年開始申請這個專利
花了五年的時間來讓之通過
真的不知道該說有錢真好(亂槍打鳥)還是真的他們確實高瞻遠矚。



而我曾經試著想要自己申請看看，想說自己就加減把筆記本裡面一堆點子申請專利
卻發現專利的申請費用也不是一般人能夠負擔的...殘念。

那這篇談的是甚麼態度?
就是設計師該要為自己的設計認清價值，的態度。
還有就是對於別人的設計，能有肯定其價值得開放態度。
還有就是，自己的設計被忽視，也要繼續解決問題(產出新設計)的態度。

滑入滑出螢幕邊緣與費茲定律的感想

其實邊緣滑動來執行動作似乎已經成為一種UI的慣用手法了
例如:展開表單或者回到上一頁.

早期在討論滑鼠游標由"螢幕內"滑向"螢幕邊緣"的按鈕時，因為會被螢幕邊緣卡住，
所以可以看成使用者一直在一個無限大的按鈕上，所以很好點擊

而從螢幕外滑進螢幕中，我覺得很有趣的是，
當使用者碰到螢幕邊緣時
可以視同為"進入一個按鈕"
而繼續往螢幕內滑動的時候，則等同於在一個按鈕中滑動了
所以可以視為"感應區等同於螢幕大小"
所以也是相對好觸發.

為了減少硬體按鈕的使用，可以看到這種方法已經可以成為一種趨勢了

最近看到BB10從螢幕底部滑動可以進到HOME的第一頁，也就是使用中的APP清單

而延伸使用就是往上滑之後加上L型的轉折，就可以從左側拉出EVENT CENTER(NOTIFICATIONS)

BlackBerry 10的WIDGET?

最近又看了一些BB10的HANDS ON 影片
發現其實BB10並沒有真的支援WIDGET(至少我看到的影片如此)
而是利用HOME的第一頁來放置"ACTIVE FRAMS"
也就是執行中的APP...類似ANDROID的MULTI PAGE按鈕

不過有趣的是，BB10的人員強調
這些ACTIVE FRAME都是動態的，所以即使是個縮小版的圖像
還是可以讓使用者看到更新的資訊
影片中展示了"天氣"APP的用法，
天氣APP在ACTIVE FRAME中還是會不斷地更新資訊
所以也可以當作WIDGET來使用....

不過HOME的第一頁，只能放置八個ACTIVE FRAMES...
而且還會按照執行的順序排序
這樣說來似乎不如WIDGET來的CONSISTENT(一致性)
至少WIDGET位置不會亂跑

不過詳細如何，真的很希望能弄到一台來玩玩，
我想，我應該會告別IPHONE了吧

ANY.DO 使用心得

ANY.DO一直是我最喜歡的待辦事項APP
唯一美中不足的是，無法像GTASK(ANDROID)那樣可以緊密地跟GOOGLE CALENDAR/TASKS結合，
不過我寫使用心得的重點，多半是從介面元素的配置來做感想分享的，
就讓我來寫寫這款APP吧。

我覺得最棒的點如下:
1.把分類方式的選項放在最下方(IPHONE VER.)，我的理由是，如此一來，切換分類法的就在大拇指的觸控熱區內了，非常適合單手操作。
可惜ANDROID還是用粉笨的右上角三顆小點的選單@@

2.往下拉就可以立刻新增ITEM，同時還有語音輸入的選項。
這點跟CLEAR很像，只是CLEAR沒有語音輸入。
這個我覺得很棒，因為把最常用的動作，讓大拇指可以用最簡單的方式來執行。
當然，這個動作之前是被應用在"更新內容"這個動作，所以萬一同時有更新跟新增的兩個動作需求的時候，如何去取捨就要仔細考慮了。
不過，我覺得這也是"逐漸被歸類出來的""觸控裝置"的UI通則，應該會變成一種普世的操作行為。

3.往又一滑，就能把項目"槓掉"。這被很多人廣泛討論過了，很爽快，很符合實體紙本待辦事項的操作經驗。而這個功能其實也已經很普遍可見了，不過ANY.DO會把槓掉的已完成項目排列在清單下方.而當你想把被槓掉的項目還原時，只要"反向"，也就是往左一滑，他就會跑回去"原來"未完成的地方了。

CLEAR也有類似的功能。不過CLEAR的還原還是滑向右邊，而且復原後並不會回到"原來在LIST的位置"。而CLEAR把項目左滑一律定義為"刪除"。