EVENT

Loftwork Designing Approach #1
以UX為軸心的網站設計流程

理解使用者的第一步:策略、要件定義。

UX的重要性雖已廣泛獲得認知,但要以何種流程、手法活用於網站製作現場呢。2016年3月18日Loftwork舉辦了第一次「Loftwork Designing Approach」的免費研討會「以UX為軸心的網站設計流程」。在此報導由活躍於第一線的創意總監所主講的段落。

Loftwork Creative Director 青木大地

必須透過整體服務理解使用者

「使用者是帶有目的而造訪網站的。舉例來說,對於造訪『Amazon.co.jp』的使用者來說,獲得想要的商品便是他的目標與目的。網站僅僅是他的經過點,其前後也還存在著服務與接觸點。為考量提供商業上新的價值,就必須在本質上貼近使用者的需求」青木說道。不僅是網站,而必須考慮整體服務的UX,並反映在網站設計上。

心智模型與內在洞察

那麼,該如何理解使用者呢? 青木強調「心智模型」與「內在洞見」這兩個關鍵字。

何謂心智模型?
換句話說,可用「思考流程」、「行動原理」、「思考模式」等字來表達。理解心智模型與得知使用者的根本價值觀相關。

何謂內在洞察?
表面所顯現的使用者言行,形成行動、思維、價值觀原因的深層心理。在Loftwork,透過深入挖掘使用者的訪談,使內在洞見得以顯現。

理解使用者的重點在於「萃取內在洞察」

青木主要說明了「使用者調查」、「萃取內在洞見」、「製作人物誌CJM(顧客體驗旅程地圖)」等三個流程。使用者調查,介紹Loftwork所進行的訪談方法。「訪談並不是面試。有時一邊使用紙牌或地圖等工具,一邊與受訪者維持親近的關係。進行讓受訪者能覺得「真好玩」的訪談是很重要的」青木如此表示。接著就是「理解使用者流程中最大的重點」,談及「萃取內在洞見」。將訪談的資訊摘錄在標籤紙上,並貼在仿製紙上進行研究的作業。一看之下雖然簡單,卻要處理大量的資訊,為與下個流程(製作人物誌CJM)能連接,有幾個訣竅。

首先於黄色標籤紙上,如實記下於訪談所聽到使用者的言行、事實資訊。「對於受訪者所採取的行動,明確摘錄出『為何這樣做』的原因,便能獲得更深入的資訊」青木說道。接著,將貼出的標籤紙分類整理。重點是不要在每一個標籤紙上貼上標籤條。「貼上標籤條就只會意識到該標籤條上所寫的事,就可能錯過特意摘錄在黃色標籤紙上那些『隱藏在言行中的資訊(事實)』青木如此說明著。
一邊觀察同組黄色標籤紙(言行、事實資訊)的關聯性,一邊「翻譯」其中背後共同的價值觀、思維,並摘錄至藍色的標籤紙。青木說「進行10人的訪談後,約可整理出100張的藍色標籤紙」。將藍色標籤紙再度分組整理,便可引出內在洞見。
「製作人物誌CJM」,是「將直覺難以掌握的內在洞見賦予使用者與該行動,並將其視覺化」的作業。基於內在洞見製作人物誌,依照與服務的接觸點,用文字將使用者所「思考的事」、「感受到的事」、「引起的行動」=心智模型來表現。這就是CJM。來到這步驟,就可進行實行策略的發想、UX概念的視覺化等網站設計的具體流程

對流程實行重要的三項要點

青木針對理解使用者與設計網站上,舉出了以下三個重點。

1. 實際感受與使用者的接觸
⇀ 獲得貼近使用者的觀點、感受。

2. 由各種觀點(共創)產生的加乘作用
⇀ 考量商業觀點的新價值誕生。

3. 建構團隊
⇀ 誕生高品質的輸出物

青木在海外也正為了許多調查而舉辦工作坊。他說透過前往當地,接觸生活模式,能更深體驗感受與使用者的接觸。此外,他強調與不同領域的專家共創的加乘作用,並指出「到企劃最後,不是很少調查的相關的事物嗎」。他如此總結「今後也想持續進行,從頭到尾成員都與之相關的企劃」。

將概念成形,創意總監工作:網站設計

接續青木的分享,更加具體介紹內容的是創意總監氏家浩史。根據網站更新企劃的事例,解說了由理解使用者到設計,更深了解流程的內容。

Loftwork Creative Director 氏家浩史

不解釋是訪談的重點

氏家說「其實說來以UX為軸心的網站設計流程是什麼呢?」他提出這個問題。「換句話說,可說是以事實為軸心的網站設計流程。不是憑天分或靈光一現的想法來設計,而是將調查所集的事實,反映在網站設計上」他如此定義。氏家所負責的是某個觀光地點的網站。以青木所介紹同樣的方法,透過訪談深入挖掘使用者著心智模型與內在洞見。在東京針對曾去過該光觀地點的10名使用者,並在當地針對10名觀光客進行了訪談。訪談中,從造訪該觀光地點的次數、住宿地點、同行人員等基本問題切入。針對多次回訪的受訪者詢問「會多次造訪的原因?」,還問「對您而言那是一個怎樣的地方?」、「為什麼有這種感覺呢?」等深入探詢。「重要的是,不以聽者的價值觀解釋,如實地記錄受訪者的心情。此外,反覆詢問後,也會有受訪者語塞,或與真實的心聲相左的情形。這時改變問問題的角度,或使用工具等,針對貼近其價值觀下功夫是很重要的」。

如何活用零散的資訊來設計網站?

因為本次進行的是觀光地點的網站,與一般企業網站相比,更廣泛地訪問使用者。團體旅行的熟齡女性、以女性旅行為目的的年輕女性、 外國旅客也不在少數。當然還有海外富裕階層的造訪。以同樣的問題分別詢問他們,當然會得到截然不同的回答。

「若要應付不同使用者所有的需求,便要增加全球導航,或是內容就會重複,網站的設計就會變得複雜。為此我思索出,重要的不是反應使用的需求,而是以價值觀與思維做基礎來進行網站設計。於是有趣的是,我發現團體旅行的女性與國外富裕階層的思維模式其實是相同的」氏家在回想時這樣說道。根據訪談結果,並經過工作坊所導出的結果為以下3種心智模型。

<對話題性的興趣>
能在朋友間形成話題,或是看到雜誌電視看到產生興趣。覺得到底是怎麼一回事呀。

<對事物的興趣>
這裡有至今美術館所沒有的藝術體驗。哪個作家的哪個作品,所表現的意圖是什麼呢。

<對事情的興趣>
來這裡能省思許多價值觀與生活方式。想透過發現與驚奇與自己的現狀做連結。

將過於複雜的導覽項目整理至一半

經過調查與工作坊所理解的使用者心智模型。在更新時,其中一例實施了以下的策略。

  • 將有13個項目的全球導覽整合為7個項目(語言切換器除外的話則為5個項目)。
  • 為回應對事情的興趣,增設了新內容「故事」。
  • 為回應對事物的興趣,在全球導覽中設置「藝術」類別。
  • 將以前為附屬導航的「交通資訊」升級至全球導覽。

氏家指出「透過整理導覽,使內容構造變得清楚明瞭。以使用者行動為軸心的流程,在網站設計中對於資訊設計此一切入點也特別有效」。此外,談到設計、製作流程的重點。「我們以高頻度在活用工作坊。要點的整理與分類,精粹出課題等,目的雖各式各樣,但透過多個利害關係人的參加,在公司內形成共識,並可期待團隊建構的效果」。

在會場,一邊接受來自參加者的提問,一邊補充本文。變成一個可一窺監督者在理解使用者與重視概念明確化時的姿態的互動式時間。

Q:若為BtoB模式時,製作人物誌的困難處為何?
A:若靠間接方式,我認為一定可以找到接受訪談的對象。與公司關係人員進行訪談也為方式之一,總之我建議先出聲採取行動。雖然品質可能會有改變,但確實設計訪談與實施是非常重要的

Q:人物誌為何製成五個?
A:若數量過多,對人物誌的想法便會分散,產品或服務的軸心概念便會偏移。相反地,若數量過少,發想便無法拓展開來,要使其講究便也會困難。考量五個是適切的數量,便將人物誌設定如此。

Q:Loftwork在執行訪談時,大約會花多少時間呢?
A:平均訪談會花上二小時左右。然後若要聽到深入的談話,事前訪談工具的準備便很重要。正式訪問前與研究成員事先進行前導測驗後,才正式上場。此外,訪談後也花上差不多的時間進行分析。

近來「UIUX」此關鍵字正受到注目,網站不單是一個窗口,此活動更明確指其是左右使用者體驗的重要接觸點,並開始發揮其功能。

Related Event

Loftwork magazine 每月發送的電子報,提供Loftwork活動情報、最新案例