【商業大數據】好想談戀愛 不如自己設計交友軟體!Figma工作坊:交友軟體介面的規劃與實作

大合照

想學習Figma卻不知道該如何開始?從產品發想到實做的步驟有哪些呢?如何增加自己在求職上的技能?管院看準現在學生對於產品設計與UI/UX設計的需求,透過教育部智慧創新關鍵人才躍升計畫補助,於10月13日邀請到企管碩擁有Figma相關經驗的龔芷姍與周舒恆,教導同學們使用Figma軟體進行交友軟體的實作,本次工作坊吸引了近40位非資訊領域背景的同學們前來參與。

本次Figma實作的主題為交友軟體,是因為交友軟體的功能與概念簡單易懂,市面上也有許多類似產品可做為參考,同學們較好進行實作與發想。

交友軟體是這個世代經常用來交友、拓展人際關係的媒介,現今許多人都會不時滑一下,尋找志同道合朋友,如今已發展出諸多款交友軟體,而好不好用,直不直觀,也成為大家選擇繼續使用的考量之一。

首先,芷姍帶領同學們以使用者的角色進行設計思考,定義出使用者的需求,並根據需求中不同的情境找出解決方法,評估可行性。

前半部份由芷姍進行分享

在實際設計前,可以先畫出wireframe(線稿框),並且定調產品的關鍵字,講者說到,只要手邊有筆就可以進行介面視覺化,而且線稿框要是可以修改的,因為需要了解使用者需求,思考哪些對使用者來說是直覺的、必要的設計,逐步調整成適合使用者的產品。至於要如何繪製線稿框呢?大致上有三個步驟,我們可以先列出所有頁面以及包含的內容,接下來繪製各頁面內的元素,最後進行元素的編排,即可完成線稿框,是個十分淺顯易懂的方式!

其中,講者提到了一個有趣的「雅各布定律」,指的是使用者的預期心理,相似的APP會有相似的操作介面,因此在設計時可以遵循這些共同的設計慣例,讓使用者不需要額外學習即可以輕鬆上手操作,這也可以作為我們設計時的參考。

另外也帶同學們了解何謂Prototype(原型),Prototype是互動體驗樣品,可以用此來模擬使用者真正的使用情形,包括頁面的切換、實際的運作方式等,幫助產品團隊更好將APP或網頁具象化,也可以預先排除錯誤,進而降低成本,而這也是本次工作坊的重頭戲——帶領同學們完成一個基本的交友軟體Prototype。

接下來進到實作環節,由另一位講者舒恆帶領大家先進行Figma的初步介紹,了解一些常使用到的功能、插件,也分享了幾個實用的資源,方便同學們後續實作時更快速上手。

後半實作部分由舒恆帶領

實作交友軟體 從STP分析

之後,便進到了本次實作的主題「交友軟體」,講師先提供了預先做好的完整版本給同學們參考,並且從STP分析開始,逐步說明此交友軟體是如何進行發想,例如下關鍵字、主色調制定等,也利用了許多市面上的交友軟體做為範例,說明他們的概念,幫助同學們更好理解。

然後,再從頭一步步帶領同學們進行實作,儘管本次工作坊由於時間有限,除了基礎的功能外,進階的功能只有做到頁面部分滾動以及Prototype頁面切換的部分,但同學們仍然可以參考講師給的範本,繼續將上課的作品製作完成。

透過此次活動,激發了不少同學們對Figma以及產品設計的興趣,並且在課堂上踴躍地向講者詢問相關問題;講者們也配合同學們的速度,仔細講解並且在必要時下去協助同學們操作,同學們在此次工作坊活動都有不錯的吸收,製作出自己滿意的成品。講者也強調,最重要的是,學習Figma和UI/UX設計需要時間和努力,勉勵同學們要持續地精進軟體的操作與設計思考的練習,才能在產品設計上有所進步與收穫。

同學們認真聽課進行操作

(資管所莊家綺撰稿 / 管院媒體編修)