<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>網站/Mobile企劃顧問,課程,Axure RP-悠識數位 &#187; 細節放大鏡</title>
	<atom:link href="http://userxper.com/topics/ue_column/detail_at_ui/feed" rel="self" type="application/rss+xml" />
	<link>http://userxper.com</link>
	<description>悠識數位(UserXper)以「網站/Mobile企劃」為服務核心，提供三種網站企劃相關服務：分別是網站企劃軟體，網站企劃培訓，網站企劃專案。悠識數位將協助您為您的顧客創造更好的「網站使用者經驗 (Web User Experience」。</description>
	<lastBuildDate>Thu, 09 Feb 2012 07:58:18 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3</generator>
		<item>
		<title>5個知名網站的多語系導覽規劃方式</title>
		<link>http://userxper.com/blog/archives/559</link>
		<comments>http://userxper.com/blog/archives/559#comments</comments>
		<pubDate>Mon, 07 Dec 2009 16:21:12 +0000</pubDate>
		<dc:creator>richard</dc:creator>
				<category><![CDATA[細節放大鏡]]></category>

		<guid isPermaLink="false">http://userxper.com/?p=559</guid>
		<description><![CDATA[除了那些走向全球化的知名台灣品牌與企業，多語系網站規劃在國內很少看到。 其餘的類型，不管是商業網站或政府網站，大概不太會遇到多語系網站設計問題。 這一兩年處理過幾個多語系的網站，發現在規劃時，經常與客戶陷在語系與地理位置上的混淆。這裡記錄了一些觀察，分享給大家，提供參考！ 語系與地理概念的選擇 英文網站是美國的網站嗎？不一定！ 台灣網站就一定是中文網站嗎？不一定！ 當本土的企業網站其目標市場是全球，那麼該採用什麼語系或地理位置來分辨呢？ 這篇文章目的不在於提供一個快速簡單的答案，因為當企業(或機構)的商業情境不同，就必須採用不同的方式進行規劃。如果你清楚網站的目標使用者，以及商業策略及情境，應該可以做出正確的判斷，採用什麼方式做規劃。 這裡提供幾個知名企業/網站的作法，協助大家思考： 1. Flickr (http://www.flickr.com) Flickr採用自行判斷訪客地理位置的技術，因此如果你在台灣連上Flickr，會直接看到繁體中文的網站。另外一種作法是判斷瀏覽器的語系參數，來決定拋出什麼語言介面給網站訪客。 透過程式自行判斷地理位置的技術，請自行詢問google大神，關鍵字是 『IP to location』 or 『Geo IP Location service』，就可以找到相關資訊。花點錢買資料庫，技術上是可以做到的。 Flickr的服務是全球性的，使用者不關心是否實際地理上的辦公室或公司，因此變更語系的介面命名是 『請選擇一種語言』，位於Flickr首頁的下方。 2. Acer (http://www.acer.com) 初次進入Acer.com首頁的訪客，會看到一個密密麻麻的畫面，把全世界 Acer分公司所在的國家條列出來，讓訪客自行選擇。然後利用Cookie技術將訪客選擇的分公司網站記住，下次進入 Acer.com的時候，就會直接轉進上次選擇的分公司網站。 由於Acer採用的概念是各地分公司，因此變更到其他地區網站的命名稱為 『WorldWide』(http://www.acer.com/worldwide/)。當企業很在意當地的消費者觀感，就會採用地理位置來設計多語系網站的導覽。 3. IBM (http://www.ibm.com) IBM採用的作法是，凡是首次進入IBM網站的訪客，一律先看到美國 IBM，畢竟這裡是IBM的總部。如果使用者想要變更區域或語系，則選擇 『Country/region』。因此IBM的分類主要是採用地理區域的概念。 但有趣的是進入IBM 『Country/region』，其實它的網頁標題是』Select a country/region and language』，也就是說iBM嘗試在這裡提供一個將地理區域與語系選擇的整合作法。因此當你打開它的選單，會看到一組以地理區域開頭 &#8211; 語系的下拉式選單。 比如： United States &#8211; English Taiwan &#8211; Chinese (Traditional) [...]]]></description>
		<wfw:commentRss>http://userxper.com/blog/archives/559/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>為網頁右上角的UI元素找個名字</title>
		<link>http://userxper.com/blog/archives/577</link>
		<comments>http://userxper.com/blog/archives/577#comments</comments>
		<pubDate>Fri, 04 Dec 2009 17:51:51 +0000</pubDate>
		<dc:creator>richard</dc:creator>
				<category><![CDATA[細節放大鏡]]></category>

		<guid isPermaLink="false">http://userxper.com/?p=577</guid>
		<description><![CDATA[某樣工作之所以專業，一定在過程中可以發展出很多』專有名詞』 或者 『術語』。專業術語在特定領域中經常出現。會講專業術語，就表示你是「巷子內」的人(台諺)。 比如IT術語：SQL，ERP，物件導向; 行銷廣告術語：TA，CPM，Copy(文案); 平面印刷術語：CMYK，DPI，網路行銷術語：SEO，CTR。使用專有名詞很明顯的好處之一是，同領域的人很容易溝通，且精準理解含意，不會誤解，溝通效率有效提高。另一種特性是，透過術語建立行業障礙，不是同道中人，一律視為外行。 網站企劃之所以專業，必然也要能精準地定義工作本質或工作內容。前幾天看到國外有個非正式的調查 ( http://gadgetopia.com/post/7003 )，調查網頁右上方導覽區域的命名。那個位置一般都會放這些項目：網站地圖，訂閱電子報，聯絡我們，登入，搜尋框，語系選項&#8230;。 以這兩家銀行網站的網頁來說明，畫面右上角以紅色矩形框住的位置，就是本文討論的Web UI元素之所在。 這個UI元素，以英文來說有有這麼多種講法： - Utilities 或 Utility Menu 或 Utility Nav (最常使用, 我最喜歡的UE顧問公司 Adaptivepath 也是這麼稱呼它) - Global Nav (會與主選單混淆) - Static Nav - Tools - Eyebrow Nav - Overhead Nav - Top Nav - Tertiary Nav 因為CSS的關係，也有人稱之為 - Corner Nav - Constant Nav 中文的講法有這些： - [...]]]></description>
		<wfw:commentRss>http://userxper.com/blog/archives/577/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>搜尋框 (Search Box) 的設計</title>
		<link>http://userxper.com/blog/archives/480</link>
		<comments>http://userxper.com/blog/archives/480#comments</comments>
		<pubDate>Fri, 16 Oct 2009 13:20:49 +0000</pubDate>
		<dc:creator>richard</dc:creator>
				<category><![CDATA[細節放大鏡]]></category>

		<guid isPermaLink="false">http://userxper.com/blog/archives/480</guid>
		<description><![CDATA[搜尋是網路上最常見的行為之一，沒有人會否認站內搜尋功能的必要性。透過良好的站內搜尋功能，網站使用者可以節省點選導覽選單的時間，更快速的找到需要的內容。 好的搜尋功能並不容易開發，有太多搜尋功能上的創意跟想法，必須透過程式技術來完成，也就是說介面的構成很容易，但是程式開發很辛苦！比如 AutoComplete (又稱為Live Search或Smart Search) ，又比如 Search Result Ranking (Google的搜尋結果排名就是了不起的學問)。 搜尋功能的眾多設計要素中，唯一一點跟技術沒有直接關係，跟介面設計有關的部份，就是搜尋框(Search Box)的設計。 搜尋框的設計觀念，至少包含三種元素： 1. 一個標籤文字(Label)，用來說明這裡是搜尋框 2. 一個Text Field（文字輸入框)，讓使用者輸入關鍵字 3. 最後放上搜尋按鈕(Search Button)，讓使用者執行搜尋的動作 因此我們會經常看到這樣子的搜尋框構成： 關鍵字：_________ [搜尋] 查詢：___________ [查詢] Search：_________ [GO] 然而搜尋已經是非常普遍的網路使用行為，以致於在搜尋框前面那個標籤文字似乎沒有太多作用了。因此許多網站為了節省版面空間，幾乎都不標示搜尋框的前置標籤文字了。 你注意到了嗎？下面這些知名網站，分別是Google, Facebook, Yahoo, CNet的搜尋框都沒有放置標籤文字。 取而代之的是，直接將提示搜尋的文字，放在Text Field裡頭，當滑鼠游標點擊Text Field則自動清除提示文字，這樣的設計可以達到提示效果，又可以節省版面空間，一舉數得。 大家發揮一下想像力，搜尋框的設計三元素可以被精簡到什麼程度呢？ [細節放大鏡：一次只看一個細節，從中找到問題/啟發/學習。 文章出處：悠識 UserXper.com 同步發表於 Facebook網站企劃 網誌http://faceboo.com/web.plan]]]></description>
		<wfw:commentRss>http://userxper.com/blog/archives/480/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Facebook塗鴉牆留言文字框(Text Area)</title>
		<link>http://userxper.com/blog/archives/476</link>
		<comments>http://userxper.com/blog/archives/476#comments</comments>
		<pubDate>Thu, 15 Oct 2009 13:08:25 +0000</pubDate>
		<dc:creator>richard</dc:creator>
				<category><![CDATA[細節放大鏡]]></category>

		<guid isPermaLink="false">http://userxper.com/blog/archives/476</guid>
		<description><![CDATA[網站介面設計的友善性來自於細心地處理了很多細節。 我們就從熱門的facebook來看FB塗鴉牆的留言文字框(Text Area)的設計。 一般社群網站或BLOG的留言介面，都採用較大區域的文字輸入區域，在UI Pattern的術語稱為 Text Area。常見的Text Area都是固定3行，4行或更多行的高度。 為什麼FB塗鴉牆的Text Area卻只有短短的一行高度？ 這個設計應該是從Twitter 的介面學習來的。 只有一行高度的輸入區域，在UI Pattern的術語，稱為 Text Field。 使用者看到Text Field時會自然被制約，直覺認為只要寫入一行文字，不用寫太多。因此在Twitter或FB塗鴉牆上書寫文字，潛意識中比較不會被迫要寫很多文字，沒有了這個壓力，自然就容易書寫。 Text Area高度太高，會佔掉FB畫面的上方空間。因此FB塗鴉牆以精簡的一行高度來解省空間，讓下方的各種留言有更多的機會被閱讀(跟Twitter一樣)。 為了解決使用者留言會寫下較多文字的可能性。FB塗鴉牆的Text Area會因為文字輸入自動換到下一行，而且高度也自動放大，取代一般垂直捲軸(Text Area的Scroll Bar)的介面，這是另一個貼心的設計。這等於是一種Text Field跟Text Area兩種Pattern的整合版。 當然，本文分析FB 塗鴉牆介面的優點是事後諸葛，只是藉著觀察來推測FB設計的用意。令我感到好奇的不是FB採用什麼技術 (複雜的JavaScript+CSS)完成這樣介面，而是什麼樣的過程跟構想，使得設計者最後設計出這樣的介面？ 這個介面讓FB的畫面不只提供較佳的閱讀性，更強烈的鼓勵使用者留言。類似的細節很多 (比如，讚一下)。當FB在眾多的細節中，默默地鼓勵使用者進行互動，使用者也就更容易被FB友善的介面黏住。 歡迎你留下更多不同的看法或評論。 [細節放大鏡：一次只看一個細節，從中找到問題/啟發/學習。 文章出處：悠識 UserXper.com 同步發表於 Facebook網站企劃 網誌http://faceboo.com/web.plan]]]></description>
		<wfw:commentRss>http://userxper.com/blog/archives/476/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>

