【好站介紹】meaningful transitions

這個網站，是同事找到的，就在我們大家苦思一些轉場效果的時候，給了大家一盞明燈。

這個網站由德國的研究生整理了在 mobile device 上常用的一些轉場的效果，並且將其分為六大類（Orientation, Spatial extension, Awaking, Highlight, Feedback and Feedforward），雖然我覺得有些分類其實沒那麼精準，但是也一樣可以當做參考的依據。

有些在做 wire frame 的時候都可以參考，畫出來也比較可以讓其他人理解要如何切換畫面。

整理的內容之中，有詳細的說明每個範例內容，並且有簡短的動態 prototype，點進去看還會有說明每種效果的優缺點，我沒有每個都看，把目前想用的看過而已。

紀錄一下，當個過程。

學學文創-白雪公主走進桃花源 插畫原畫展

某天下午，走進了學學文創的建築裡。
在看完無趣的竹子展覽後，正要搭電梯下樓，我看著電梯內的樓層指引，一時興起的就點了三樓，門一打開，乾淨得過頭的大廳，放著插畫展覽的海報，Yvonne Gilbert ＆ 丹尼納諾 Danny Nanos 首度來台。


咦，義大利的插畫家，竟然取材 陶淵明 的「桃花源記」做為故事主軸？
這也太神奇了，一定要去看一下，結果……真的不虛此行。


這兩個義大利插畫家的功力真的非常深厚，一筆一勾勒，整個人物的立體感馬上就從畫面湧現出來，有時候只是簡單的幾筆白邊，就讓主角的頭髮、衣袖層次立現，尤其是展出原稿，因此就更讓人著迷了吶！


而且，桃花源記裡面，其實非常非常少的文字，真的是名符其實的”繪本”，完全就是用圖畫來說故事，但有背過／聽過陶淵明”桃花源記”的其實完全都不用文字也能夠理解的喲！


這次的a原畫展，只展到９月底，所以喜歡的朋友要看要快喲！！晚上也是有開放的！

【認識國際插畫大師】

尹芳吉伯  Yvonne Gilbert

• 出生於英國諾森伯蘭的尹芳先後在紐斯卡爾學院和利物浦學院攻讀美術，做了五年的美術設計之後，在1978年轉為自由插畫家，陸續和全球許多大出版社、雜誌和廣告公司合作。她為Frankie Goes to Hollywood’s “Relax” 設計的唱片封套，被“Q”雜誌評選為「唱片封套最佳經典100」之一，該設計也被BBC 電視台譽為「經典之作」。她的插畫也榮獲許多國際獎項，英美藝廊爭相收購她的原畫展出銷售。
• 尹芳為英國皇家郵局設計的五套郵票，紛獲「金郵票獎」Il Franco Bollo d’Or 以及「世界最美的郵票」獎Gran Premio del’Arte Filatelica的殊榮 。

丹尼納諾  Danny Nanos

• 加拿大籍的納諾(Danny Nanos)自1985年起，為知名設計公司和廣告經紀公司擔任「廣告設計總監」一職，廣告作品獲當地和國際競賽獎項和肯定。納諾的設計範圍廣泛，包括書封設計、商品包裝設計、企業形象、互動媒體、建築設計等等。

資料來源：dpi 設計雜誌


提供相關連結：
唯美夢幻魔術雙人組－Yvonne Gillbert & Danny Nano

【Case Study】折疊式螢幕的平板電腦 - prototype from Imerj and Frog Design

這款折疊式的平板電腦我覺得做出了許多不同的 UI 體驗。
很多手勢的運用都有盡量講求直覺性，也有做出雙螢幕時可能會出現的一些情境發想。不過一些運用都需要記憶，有些我在看 DEMO 的時候就會混亂了，到底要怎麼放才會變成全螢幕？怎樣會變回一半的頁面？

但雙螢幕的 UI 設計和單一螢幕的就真的差非常的多，可能的運用也變得非常不同。

整理一下這裡面有用到的手勢和 UI 特殊之處：

【Case Study】Windows 7 平板電腦 - ViewSonic Viewpad 10 pro

既然都做了 Android 3.0, BlackBerry tablet OS 的功課，那當然也要來一下 Windows 7 系統的平板電腦比較一下囉！

這款平板電腦是我參加微軟開發者大會時，特別早到要去體驗區試用的，在場展示了蠻多台的，有 Gigabyte、Viewsonic、Pegatron、Dell 等，但因為很多人搶著試用，我是在最後一個 session 因為都沒興趣就跑出來趁沒人的時候試用的，就寫一下我對 ViewPad 的感想吧。

【Case Study】Black Berry - playbook 平板電腦

今天繼續 survey 相關的 pad。發現要看完一款 pad 的所有評論要花很久的時間吶…而且每看一篇就很想真的有實際來直接 run 一次，雖然我都沒實際的玩過，但至少有一些概念啦。今天就來寫 blackberry 的 playbook 吧！

心得分享 - Card Sorting

去年辦的 OpenID RP 工作坊時（翻一翻發現還沒整理起來，有空來補），原本和同事討論的是想要採用 Affinity Diagram 的方式，也實際的 run 了一遍，不過後來請教了更專業的人士，一場討論下來，發現我們採用的比較像是 Card Sorting 的方式，什麼是 Card Sorting 呢？列一些簡單的定義：

卡片分類法(Card sorting)是一種在網站或其他規劃初期常用的測試方法，透過卡片分類法可以讓我們了解一些在設計網站架構時十分有用的使用者資訊(資料來源: Wikipedia)：

• 了解真正符合使用者習慣的資訊分類。
• 比對網站設計者與使用者在對網站資訊分類上的認知差異，作為調整架構的依據。
• 找出項目命名上的問題。

 在 IDEO Card 上的定義和用法為-

HOW：On separate cards, name possible features, functions, or design attributes. Ask people to organize the cards spatially, in ways that make sense to them.

WHY：This helps to expose people's mental models of a device or system. Their organization reveals expectations and priorities about the intended functions.

看過了定義後，覺得當時採用的方式的確比較像是 Card Sorting。
今天又看到 xxc 整理的投影片，裡面有蠻清楚的方式的，不過其實我整篇看下來，還是會有一些疑惑，這可能和我沒有實際的 case 可以帶入在腦海中模擬有關吧…影片在此：

Card sorting

View more presentations from Charles Chen

【Case Study】Motorola Xoom，首款搭載 Android 3.0 系統的平板電腦

這款平板電腦是今天我才看到的，覺得它把 Android 3.0 的功能發揮的很好，所以也來做一點筆記，記下自己看到這款平板的想法。

大致規格：（詳細的規格，可以上手機王去看，這邊就簡述就好）

這款是全球首先搭載 Android 3.0 作業系統的平板電腦，是在 2011 年的 CES 消費性電子展中有展出。螢幕是 10.1 吋，重量是 730g，相較於 iPad 2 的 601g 以及 9.7 吋，比較重也比較大台，不過感覺產品設計得很好，並沒有讓我有很笨重的視覺產生。

Xoom 有支援 mini HDMI 輸出，mini USB，micro SD 卡，雙鏡頭(照相鏡頭支援 500 萬畫素，視訊鏡頭支援 200 萬畫素)；和 iPad 一樣有 3G 和 WiFi 版本，目前只推出 WiFi 版本，因為台灣目前網路環境並不支援 LTE 4G 上網，單機售價 $19800，也比 iPad 2 價格稍低，中華電信也開賣提供 3G 的一些特惠方案了喲。

【Case Study】Three buttons mobile interface concept

因為要換工作環境，未來應該會將重心都一直著重在 UI/UX 設計方面，這幾天一直會找一些相關的影片來看，剌激思考。

dxtr - 3 button mobile interface concept from ribot on Vimeo.

這個在一年前利用 3 個 button 來做手機的 UI 設計，覺得概念不錯，會想這樣做應該是想要避掉目前智慧型手機需要學習才會使用的介面操作（像是觸控的手勢）。全部的介面按鈕不超過三個，主畫面顯示在螢幕上方，功能鍵兩項都在螢幕的下方，字體很大，我想應該蠻適合老年人的設計。

不過，影片的內容，感覺整體的流程都是單方向的，資訊的層次雖然清楚，但卻無法回"上一步"。若是想要回到前一個選項時，只能一直按 "Next" ，一直按到底之後，才能再從頭選擇一次，若是點選 "Back" 回到的是 "上一層"，而不是 "上一個" 選項；這樣的設計，其實會讓使用者處在一直點選的過程，如果是我來用，我用久了就會覺得好麻煩。

如果說，這個設計同樣也支援多點觸控，除了用下方的 button 之外，也可以滑動選單的話，或許就可以省略許多繞路的情境。

另外，覺得這個設計也是屬於 icongraphic 的設計，我其實也會希望做出一種是 infographic 的 UI，在第一層與使用者視覺接觸時，就提供了資訊內容，而不只是用 icon 來引導使用者進入閱讀。

未來的路

過去-

因為覺得世界上應該還有其他更好玩的，所以跑去念了設計運算，果然很操很好玩，現在想想還真不會後悔，也因為念了它，我的人生轉了彎；畢業後，擠身的是網路行業，中間也打雜了不少的時間，雖然也常用 UI 概念在做事，可總不像是專門的人。

現在-

決定讓自己人生再轉個彎。
在轉彎前，想先好好放鬆一下，畢竟，鼓起勇氣決定要轉彎花了自己很長一段時間，想要好好放鬆，然後勇敢向前走。

未來-

之後就要踏進 UI/UX 的領域裡頭了。
自己到底能做到如何，自己也不知道，但現在已不像日前那樣焦慮徬徨了，湧上心頭的，是一種接受挑戰的剌激感，雖然我其實也不知道這樣到底是不是自己想要的，但至少我現在覺得我為自己做的這個決定，我並不遲疑了。

哈囉明天，哈囉未來，我來了！

【心得】不思考的練習

這次的端午假期，正好之前在博客來因緣既會買到的書也到了，週六在家養病的期間，邊昏睡邊讀完了它。

覺得是針對像我這樣思緒很容易亂跑，也容易想太多的人而寫的一本書，而在這三天稍做練習下，我也覺得原本很容易會激盪的情緒，較能夠透過這樣不思考的練習，獲得抒解。

這是日本月讀寺住持「小池龍之介」所寫的一本書，不要覺得”住持”的印象就是老老先生喲，小池先生是東京大學畢業的高材生呢！不可思議吧？

在博客來看到這本書的時候，覺得封面設計的很好，小池先生一個人靜靜地坐在巴士的後排，斜靠著窗，沉靜的冷色調，絕佳的攝影技巧，讓整體的光線呈現很和諧的 光暈，我就這樣毫不猶豫的買下了它，而在拿到書之後，又更加滿意，究竟出版社將書封做了霧面的處理，在照片和字體的地方上了光膠，整體的質感大大加分！我 原本想讀完後再以二手書價賣出的想法，在拿到書之後就完全捨棄了，我想這會是我要常常翻閱的好書之一，才捨不得賣掉呢！

近況

又兩個月沒發文了。
最近一直在面臨自己一些抉擇的十字路口，晚上比以往都還難以成眠。

和一些朋友聊過，我也想留下點紀錄，把一些建議在我生命的足跡上刻上痕跡：

• 多去做，多點不同的嘗試，就會試到自己真正喜歡的
• 人的一生當中，至少要陪養七十種不同的興趣
• 根據自己的狀態，去作安排跟打算；比聽到旁人建議、雜誌文章、專家唬爛來得重要得多
• 你投入了多少資源在你喜歡的事物上？（這蠻重要的，投入多少，就決定了你是否可以成為專業人士）
• 沒有交易價值並不等於失敗，擁有交易價值並不等於成功；交易價值只有多交易，越多失敗的交易才有辦法得知交易價值
• 你得先踏出去，才看得到外面有什麼
• 不要把自己變成別人希望自己變成的人
• 貪心，就是成長的動力
• 如果是我，我會毫不猶豫的背棄自己不想要的
• 大方向不變，小部份調整尚可接受

或許一時間我無法找到自己最終的方向，但就是一步一步向前進

Begula - 結合 facebook 的群組聊天室

2011/03/23 更新！

前幾天發現，其實 whatsapp 更新版本 2.6.2 後，一樣也擁有群組聊天的功能了呢！我馬上又重回了 whatsapp 的懷抱啦！

－－－
Facebook 在 3/1 宣布併購了群組訊息服務Beluga。 Beluga 是由三位google 前資深員工所創辦，Beluga 才創立 8 個月，此次亦會參加 SXSW 的盛大聚會，展露頭角。

Beluga – 在語意上是白鯨的意思，也是印度鑽石-貝魯嘉的名字，是世界最大的卵形鑽石。不曉得是不是這個團隊對這項服務的一個期待呢？希望它像鑽石一樣發光發亮！
（屏東海生館應該可以趕快註冊個帳號，include 喜歡小白鯨的粉絲們一起來聊天吧，超適合當代言人的）

Beluga 提供使用者群組聊天的功能，讓使用者能夠依照自己的社群關係，以群組（pod）的概念開立聊天室，進行群組訊息的傳送，不只可以傳送一般文字訊息，SMS訊息、影片等都可以傳，Beluga 還有一個地方很特別，就是可以與群組成員分享自己的地理位置。

這款軟體是免費的，且已經有 iphone 和 android 版本問世，沒有智慧型手機的人也可以玩網路版的，不會 miss 掉任何有 include 你的訊息喲！

2011 UX HK workshop

真的是非常久沒更新 blog 了。



二月份在我和老師爭取參加 UX HK 2011 的 Workshop 後，進入有點忙亂的月份。

這次有機會能參加這場 Workshop，了解國際在 User Experience 這塊領域的發展以及接觸不同領域的相關人員在這一塊所做的努力，是非常難得的經驗。在四個 Workshop 場次，我選擇的是 Rachel Hinman 帶領的 Mobile User Experience Essentials 場次；由於日前正好有機會著手進行開發 iphone 的應用程式，在開發的過程當中，就遭遇到一些關於使用者經驗的流程設計問題，因此想透過此次 Workshop 練習，找出適合的設計方法。UX HK邀請國際級專家來到香港進行交流與分享，在 Rachel 的簡報當中，清楚地指出在做 Mobile 流程設計規劃與做 Web 設計規劃有著顯著的不同，並且提供用來評估 Mobile Experience 的設計準則給與會成員做參考。

RWW 介紹的幾個新創服務

每年總是要上 RWW (Read Write Web) 去讀它的 review。
今年也不例外，讀了一篇：Top 10 Startups of 2010。

把幾個印象深且自己有用過的也整理一下，一共四個：

Instagram : 照片分享 app (12種特殊濾鏡)

這是去年 10 月份推出的 app，當時造成很大的一鼓風潮，我還算後期才開始使用的，但在 twitter 上滿坑滿谷的人都在使用，並且好評不斷，我當時自己沒有在用 iphone，所以只能望別人的 iphone 興嘆。

在和 ilya 借了他的舊 iphone 來用後，我也灌了這個 app，不過當時 (11月)就已傳出這個 app 有安全上的漏洞（密碼的傳遞是用明碼在傳，這也太扯了吧…），所以我也 hold 了一陣子沒用，據說 11/19 已上傳了更新版本，正在等 apple 進行審查，之後的版本會採用 SSL 傳遞，保護使用者的資料安全。

這款 app 甚至還結合了 GPS，結合 Foursquare 定位使用者目前位置，更加強了照片分享的樂趣以及高度參考價值：我在某某海邊的照片，可以直接定位出確切位置的話，我的 follower 可以依尋著位置找到當時我拍攝的點，真是太酷了！

【AR 應用】AR + identity → myID+AR (我做的第一個 iphone app)

源起:

從今年的 5 月開始，就和 ilya 一直在為計畫找人來開發行動裝置相關的 app，打算都是從 iphone 先著手，然後才接著跨 Android 平台。但事情一直不順利，一直到七月多，原本合作的夥伴沒有時間可以完成原本的案子，所以就在把原本的進度做些交接，在交接討論時，我的腦袋忽然就冒出了一個: 「AR 通訊錄」的 idea，大家一起討論，覺得這個想法不錯，就決定接下來的 case，就朝這方向邁進。

8 月，很可怕的月，有和輔大合辦的國際研討會，還有 ilya 主辦的 digital native 研討會，我想參加 Coscup 的研討會，在這麼忙亂的月份裡面，我在 Coscup 遇到了可以幫我開發 AR 通訊錄的廠商 - DK。DK 是台大網媒所博士班的學生，是 Coscup 某個 session 的講者，我聽了他的演講，很興奮的和 ilya 說這個人應該就是我們要找的人，於是合作.....就這樣如火如荼的開始了…

光是提案就花了蠻多的時間的，我大致的和外包的 DK 說明了我們的想法，就請他進行提案，撰寫企劃書，DK 沒有提過案，所以在這部份我們花了蠻長的時間在進行溝通的，為了要把這份企劃寫得完整一點，我們兩個人都在學習如何把事情做得更好。

what's myID+AR:

虛實整合，運用社群力量延伸應用服務

myID+AR 的概念，是運用通用二維條碼 QR Code 作為擴增實境 (AR) 的標記，並製作出具有社交功能的 AR 通訊錄 App。經由這個行動應用程式，使用者可以與該 QR Code 擁有者相關的社交身份與社交資訊互動。

QR Code 所包含的資訊，是中研院資創中心開發的 myID.tw 的服務產生的 OpenID URI 為主，透過 myID+AR 這個 app 的應用，使用者在讀取 QR Code 時，便可以透過點選圍繞在 QR Code 週圍的圖示，來了解 QR Code 擁有者的相關資訊，例如 : Twitter, plurk, facebook, youtube.....等帳號，快速進行瀏覽。


相關延伸應用:

1. 國際會議週邊文宣: 可印製於會議手冊、會議海報，與會者在瀏覽海報或是取得手冊時，可以透過此 App 瀏覽講者資訊，
2. 博物館展覽作者介紹: 參觀者在瀏覽作品時，亦可以透過此 App 了解作者其他資訊
3. QR Code 名片: 於名片上印製 QR Code，相關的訊息都可以藉由 QR Code 提供，強化個人 identity 
4. 名人 QR Code: 或許找一個名人代言，他們的粉絲就不用總是要上網查詢偶條的 facebook or twitter 帳號，只要用這個 App 就能一次知道

------

這是一個結合了 identity 的 AR 應用程式。
identity 指的是 myID.tw 所提供的 OpenID ; AR 指的是以有別於傳統用 marker 做辨識，改用容錯率較高的 QR Code 來做為辨識模式的擴增實境應用。

以往的 QR Code，大部份都是用在商品的型錄、DM、產品本身印刷上，為的是降低使用者在 keyin 上的錯誤率，可以更直接的瀏覽和產品有關的內容；或是，使用者會將自己個人的部落格網址轉成 QR code 做為推廣之用，但把 OpenID URI 轉成 QR Code，則是更能強化擁有者的 identity，再搭配上適當的 App，就能夠讓 myID 的服務更加延伸－mID 不只是在網路上登入用的服務，而是可以和實體 event 合作產生更大作用的服務。

目前這款應用程式還沒有能夠在 app store 上下載，中間可能都還得要處理一些上架流程的庶務（光想像就很困難了，非營利的單位要怎麼上架呢？），也還有一些細部的功能需要再做調整，就請大家慢慢期待啦

【AR 應用】Twikle - 與環境互動的 AR from 日本東京大學

週日無聊上 AR Wire - AR news room 時看到這個應用，是由日本東京大學發表的一款 AR ，與其他的 AR 不同之處，在於開發者用的是手持式的投影機，結合了 Web cam ，一邊投像，一邊拍攝畫面，即時運算週邊環境數值，然後與自己開發的小人物進行互動。

在影片中可以看到這個可愛的小娃娃，會和屏幕上的圖形呼應，一旦遇到障礙，就會彈開或是跳開，遇到階梯狀的圖形還可以爬樓梯，投影到哪裡，互動到哪裡，運算速度算很快，不太會讓人有 lag 的感覺。