It's FROGiology » 推介網站 http://blog.frogiology.com the study about me Sat, 16 Jan 2010 19:26:40 +0000 en hourly 1 http://wordpress.org/?v=3.0.1 用戶體驗 – User Experience http://blog.frogiology.com/2009/09/04/user-experience/ http://blog.frogiology.com/2009/09/04/user-experience/#comments Thu, 03 Sep 2009 18:43:46 +0000 Stanley Fok http://blog.frogiology.com/?p=692 在我還小的時候，互聯網剛剛起步，網站設計的焦點都是放在外觀為主。現在我們身處web 2.0的世代，網站已再不是單向的為我們提供資訊的工具了。我們除了在網站上取得內容 (retrieving information)，還會處理資訊 (processing information)，甚至是建立資料 (creating information)。由此看見，用戶跟網站的溝通已經變成了雙向、互動的模式。用戶體驗 (User experience，或UX) 一詞，也漸漸被網站設計師及程式員所重視。

那甚麼是用戶體驗? 簡單來說就是指用戶根據某一個設計，經過使用後他所得出的感受。Jesse James Garret 可以說是對用戶體驗有深入理解的佼佼者了。早在2000年時，他已為用戶體驗進行深入探討，並且定下用戶體驗的重要元素，由抽象的概念慢慢延伸至具體的表現方法:

  • User Needs: 研究用戶習慣，了解網站目的
  • Functional Specification: 詳細描述網站的功能，必須為解決用戶需求為大前提
  • Interaction Design: 計劃用戶在網站內的流程 (page flow)，以及用戶與資料互動的模式
  • Information Design: 考慮資訊在網站中表達的方法，並且要令介面乎合用戶互動的模式
  • Visual Design: 主要是從美學角度設計網站外觀及感覺 (look and free)
The Elements of User Experience

The Elements of User Experience

Source: “The Elements of User Experience.” Jesse James Garret. (PDF)

以下這個powerpoint，在Interaction Design 及 Information Design 這兩個層面說得也很精彩，Stanley 在此極力推介呢!

Designing Rich Applications

View more documents from Theresa Neil.

更多資料:
http://konigi.com/wiki/user-experience-design
http://semanticstudios.com/publications/semantics/000029.php
http://www.jjg.net/elements/

]]> http://blog.frogiology.com/2009/09/04/user-experience/feed/ 6 頑遊關西 2009 Day 4 – 和菓子教室 http://blog.frogiology.com/2009/04/22/osaka-trip-2009-day4-1/ http://blog.frogiology.com/2009/04/22/osaka-trip-2009-day4-1/#comments Tue, 21 Apr 2009 18:46:05 +0000 Stanley Fok http://blog.frogiology.com/?p=571 IMG_4057

京都的確是一個很美的地方，可是由於行程緊迫，我們只能夠花兩天時間於京都，一天在東，一天在西。我的感覺是，東面比較人多熱鬧，西面就貼近大自然，各有各的特色，若要體會京都的風情，必定不能錯過它們哦。

今天的重頭戲就是學做和菓子了，這是女朋友強烈要求的行程，為了滿足她這個願望，我也搜集了不少和菓子店的資料，終於給我找到在嵐山有分店的甘春堂~ 一節課1小時15分鐘，做三款和菓子，學費每人2000YEN~ 只要女朋友開心，花多少少錢也沒所謂啦~

以下是今天的行程:
0930 坐地下鐵御堂筋線到梅田，再轉乘阪急電鐵到達阪急嵐山駅
1030 遊覽渡月橋一帶
1230 於嵐山吃午餐及購物
1400 參觀天龍寺
1500 甘春堂和菓子教室
1650 乘坐嵯峨野觀光列車到龜岡
1720 於龜岡的花田拍照
1800 乘坐JR山陰本線馬崛駅到二条駅
1900 參觀二条城夜櫻觀賞活動
2100 到京都JR駅回大阪
2200 到道崛頓吃晚飯及購物
2330 民宿四季居

頑遊關西 2009 Day 4 路線圖

嵐山、嵯峨野，就是今天的目的地。有些旅遊書教大家從大阪去嵐山，可以在梅田坐JR山陽本線到京都駅，再轉乘山陰本線到嵯峨嵐山駅。這路線大概要一小時多的車程，但其實到嵐山是有另一個路線可供選擇呢! 在大阪的梅田，其實也是阪急電鐵的總站(從地下鐵站走過去只是幾分鐘的路程)，那兒有電車直到京都的河原町。如要到嵐山，只要在中途站”桂”轉車便可，非常快捷方便。還有就是下車的地點鄰近著名景點渡月橋，在安排行程上也更方便呢~

IMG_3832
這就是阪急的電車了，棗紅色的車身給人一種典雅的味道~

在阪急嵐山駅下車，就是嵐山公園的範圍。這天，我們終於第一次近距離接觸到開了花的櫻花樹了!

IMG_3845
櫻花沾上了雨水，特別純潔~

IMG_3864
來一張旅遊雜誌的例牌甫士~

IMG_3870
嵐山就是給人這種家鄉的感覺，你感覺到嘛~

IMG_3889
日本旅遊大使露露~

IMG_3982
大堰川有船隻出租，你更可以逆流而上到龜岡一帶呢!

IMG_3937
在渡月橋對岸，是人力車出租的地方，兩人同坐大概$3000YEN 15分鐘~拉車的都是很年青，有的更是女孩子，他們除了拉車，還會當導遊，而且還是搞笑能手呢~ 總之服務態度一流!

IMG_3956
突然在京都的路山見到了一隊車隊，是甚麼政治團體麼…?

IMG_3974
行過了渡月橋，是一條大街，兩旁商店林立，消費慾又再爆發…

我們報了甘春堂下午3時的和菓子製作班。為了不要遲到，我們早30分鐘已開始出發前往。雖然甘春堂的位置比較遠，但是路很易走，有地圖是一定找得到的~ 我們很快也找到了位置，可是我記錯了上課時間…最後都是遲到了…

IMG_4037
嵐山甘春堂分店~

IMG_4040
漂亮嗎~? 這是……老師做的…~

IMG_4053
這就是我們的用心之作~ 大家估到哪個是我的女朋友做的~?

IMG_4060
來跟老師的作個比較吧…呵呵…-_-”

IMG_4067
他就是我們的老師了，雖然我們不會日語，但他也很細心的教我們呢~

IMG_4056
做完了~ 有一個和菓子是即場吃的~ 還有一碗濃濃的綠茶喝~ 深深體會到日本文化呢~

有用連結:
甘春堂和菓子教室 – http://www.kanshundo.co.jp/museum/make/annai.htm
其他網友在甘春堂做和菓子的過程 – http://www.wretch.cc/blog/ikumichan/12225972


頑遊關西 2009 Day 4 路線圖

相關文章:
頑遊關西 2009 Day 1 – 超感動民宿四季居
頑遊關西 2009 Day 2 – 踏進奈良的麋鹿國度
頑遊關西 2009 Day 2.5 – 夜遊大阪
頑遊關西 2009 Day 3 – 和服初體驗
頑遊關西 2009 Day 3.5 – 京都．東山花燈路
頑遊關西 2009 Day 4 – 和菓子教室
頑遊關西 2009 Day 4.5 – 嵯峨野的浪漫號列車
頑遊關西 2009 Day 5 – 遊大阪城天守閣

]]> http://blog.frogiology.com/2009/04/22/osaka-trip-2009-day4-1/feed/ 5 wonderfl – 為Flash Developer而設的Web 2.0平台 http://blog.frogiology.com/2009/02/05/wonderfl-build-flash-online/ http://blog.frogiology.com/2009/02/05/wonderfl-build-flash-online/#comments Wed, 04 Feb 2009 16:54:29 +0000 Stanley Fok http://blog.frogiology.com/?p=498 今天看到了一個非常之厲害的網站，叫wonderfl(真是不得不叫人說wonderful…)，由一位叫kayac的日本人做的。這個網站的賣點，你可以直接在網站上寫actionscript，並且可以立即compile查看結果! 過程無需使用Flash的IDE也可做出令人拍案叫絕的效果! 作者把compilation這一步放到server上做，果真夠創意呢!

Wonderfl 主頁

Wonderfl 主頁

用戶的code及compile了後的結果

用戶的code及compile了後的結果

除此之外，網站還加入了web 2.0的元素! 例如你可rate別人寫的code，rate 用戶等等功能，使用戶更加有心在這個平台上做出出色的作品，互相分享! 另外，最有用的就是code search的功能，例如你不知道”ColorTransform”如何使用，你可以來wonderfl找找code reference看，這對於學actionscript是十分有幫助的!

不過有一點要說的是，因為沒有了Flash IDE的關係，所有的UI上的東西都要寫code來generate出來了，而且這個工具只有對actionscript很了解的人才懂用啦。

最近作者還加入了Papervision3D 2.0的支援，想看更多Papervision3D 2.0的範例嗎? 快去看看啊!

以下是一些傑出的作品~



]]> http://blog.frogiology.com/2009/02/05/wonderfl-build-flash-online/feed/ 0 Flash Loader Gallery http://blog.frogiology.com/2009/01/15/flash-loader-gallery/ http://blog.frogiology.com/2009/01/15/flash-loader-gallery/#comments Wed, 14 Jan 2009 16:56:25 +0000 Stanley Fok http://blog.frogiology.com/?p=473 今天看了一個有趣的website叫”Pretty Loaded”，它是一個Flash Loader的Gallery。這些loader都是出自很多出名品牌的網站，如Nokia、Coca-Cola、Sony等等。設計時沒有靈感嗎? 來參考一下吧~

http://www.prettyloaded.com/

Coke Zero By Coca-Cola

Coke Zero By Coca-Cola

The Da Vinci Code 電影

The Da Vinci Code 電影

]]> http://blog.frogiology.com/2009/01/15/flash-loader-gallery/feed/ 0 虛擬連接現實，Fun for Sharing http://blog.frogiology.com/2008/09/20/fun-for-sharing/ http://blog.frogiology.com/2008/09/20/fun-for-sharing/#comments Sat, 20 Sep 2008 04:30:57 +0000 Stanley Fok http://blog.frogiology.com/?p=228 今天Stanley想介紹一個很好玩的網站，是我舊公司的出品，是Canon Pixma 系列打印機的campaign website﹕http://www.canon.com.hk/pixma。

它跟一般網站不同的地方是能夠把虛擬世界連接現實世界。那即是如何呢?

在這個網站，你可以上載你的相片，並且加上文字設計自己的相片。一般的網站可能到此便停了，最多可能加上一個Gallery顯示所有用家提交的設計。但在這個網站上，當你設計完你的相片後，你是可以搖距控制一部Canon打印機把相片列印。同時間，通過Yahoo! Live的技術，你可以在網頁上實地看到你自己作品「出世」!最後這個hardcopy可以寄回給自己或朋友呢~

這個execution，除了可以立即讓用戶測試到打印機的性能，而且還表現了Canon對Pixma系列打印機的信心(因為Live的，一當機就個個也看到了…)。最有趣的就是能夠把虛擬接上現實，產生一個一氣呵成的流程。

Stanley 昨天也打印了很多~因為太好玩了，而且費用全免。不過這個打印機是有”office hour”的，是星期一至五，早上十點至夜晚九點，要印就快手了~

為相片加上字句

為相片加上字句

看著相片出世了~

看著相片出世了~

熊貓相片出世!

熊貓相片出世!

]]> http://blog.frogiology.com/2008/09/20/fun-for-sharing/feed/ 0