UX案例:設計一個AI繪圖交流的社群軟體

介紹

ArtsIgn 是一款以AI生成的圖像為主、包含著藝術創作到設計創作，並為了涵蓋各種不同的人們且使他們互相認識、相互交流而產生的軟體。

理解問題

現今的各種AI繪畫網站或是繪畫、插圖分享網站又有什麼問題呢?首先我們認知到現今許多的繪畫、藝術創作網站，大部分還是夾攏著由真人所創作的作品，這並非不好，不過會使得想要搜尋的用戶們遇到許多挫折，即使是應用程式中有提供相對應的關鍵字，不過由於AI生成是透過「Prompt」來產生，也是我們常說的「溝通」或是「咒語」，且一張圖的Prompt可能是許多單字，這使得大多藝術網站並不會將它納入。

而現有的AI生成工具自有的網站又有何問題呢?舉midjourney的網站來說，雖然他有著龐大的用戶，也有非常大量的、優質的圖可以被觀賞，但是無法留言給創作者以提供更好的建議，這使得創作變的狹隘。

為了成功的生成這個軟體，我們使用了以下的方式來進行

使用工具:Adobe illustrator、Adobe Photoshop、Adobe Indesign

免責聲明:此設計基於創作考量使用了midjourney引擎製作了圖片，且以付費為可商用模式，請安心瀏覽。另網站、應用程式截圖皆為首頁並且目的非商用，若有觸法還請告知，將立即刪除。

團隊人數:含本文作者共三人

Enpathize 同理心階段

在同理心階段，我們採用了競品分析來進行探討，我們採用了2個社群軟體Instagram、Twitter;2個藝術創作軟體Artstation、Pixiv;以及midjourney的網站，總共5個程式來進行分析，並採取其優化結果。

分析時，主要依循著以下幾個目標:

1. 該程式為何成功
2. 該程式顯眼的地方、或功能
3. 該程式的痛點
4. 該程式的引導，是否直覺

Instagram

優點

1限時動態的推出讓朋友圈可以相互知道對方現在如何

2.貼文的呈現非常的便利

3.個人檔案的個人化非常成功

4.探索功能使得社群應用程式變得更加有趣

缺點

1.搜尋特定標籤時若沒有加上#字號會讓搜尋變得不完整

2.搜尋特定用戶時，若帳號(如AAA_1234搜尋成了AAA1234)可能會導致出錯

Twitter

優點

1.有來自全球不同國家的用戶

2.可以自己更改背景的深淺色主題以及字體色

3.會依照著你的瀏覽而推薦你新的喜好、以及流行趨勢、推薦跟隨

4.在搜尋時會優先把”標籤”放在”用戶”前面，使得用戶的搜尋變得更加流暢

缺點

1.搜尋特定字眼時，所出現的內容可能會有誤，例如搜尋”天空”字眼時，可能也會搜尋出”今天空的很”等其他人所回覆的推文

2.當你想要看見推文的留言時，按下聊天按鈕不是看見留言，而是”留言”，若要看見留言則須點開推文，這個互動方式並不是很直覺

Artstation

優點

1擁有各種不通通路的用戶，從個人藝術家到特效創作、遊戲開發

2.擁有各種不同風格的藝術創作，並且包含了2D、3D形式的藝術創作

3.登入可以有其他選項、增加了方便性

4.首頁上方會有各種方向的藝術創作選擇供給參考

5.有著google外嵌程式可以在瀏覽時發現作品

缺點

1.使用者擔心AI創作會影響到真人創作的曝光度

2.當你想要留言時，留言選項比較難被找到

3.搜尋系統沒有辦法很了當地找尋關鍵字、或標籤

Pixiv

優點

1.可以祕密的追隨著自已喜歡的畫家

2.跟隨著你的喜好而提供各種相對應的標籤

3.在搜尋時提供你該APP最多人創作的前幾大標籤

4.提供了漫畫、插畫、小說、GIF等形式

缺點

1.內容較為狹隘，大多是日式插畫為主

2.血腥、色情、暴力內容可能會被搜尋出來

3.單一標籤過多導致難以搜尋

4.若內容過多可能會在瀏覽時瀏覽得更久

Midjoutney網站

優點

1.擁有非常大量的圖可以欣賞、瀏覽

2.擁有”最新的”以及”最熱門的”兩個主要方向提供瀏覽

3.每張圖可以看到大概的Prompt

4.也包含了旗下的另一款引擎nijijourney的圖

缺點

1.要複製prompt時需要特別多點幾個步驟，不夠直覺

2.收藏的地方不夠顯眼

綜合主要發現

1. 標籤化的方式使得作品的曝光度增加
2. 最新的與最熱門的是一個非常好的主意
3. 在搜尋系統中以標籤在前帳號在後可以使用戶搜尋時直覺許多
4. 個人檔案的個人化非常重要
5. prompt的顯示方式

Define 定義階段

從同理心階段的競品分析中，我們製作了兩個人物誌，同時包含著"藝術"以及"設計"兩種範疇

Ideate 發想階段

為了使ArtsIgn 成功，我們建立了以下方案

用戶目標

1.能夠直覺的點選相對應的功能

2.能夠簡易的瀏覽以及交流

3.能夠使熱門項目在一定時間內被看見

User Flow

在User Flow中，我們試圖導入更加直覺化的流程以引導用戶去使用

登入

觀看貼文以及發表貼文

季度畫廊

中保真線框

以下是我們對ArtsIgn功能的初步想法，並將其以電腦工具繪製而中保真度的線框

中保真用戶流

為了方便審閱與檢視，我們綜合了以上的中保真線框以及User flow 來展示

登入的User flow

瀏覽、收藏、個人資料與季度畫廊

Prototype 原型階段

為了更清楚的檢視我們的應用程式，我們製作了有彩版本的wireframe來提供審視

wireframe

在這個階段我們作了以下幾件改變

1. 增加了啟動畫面
2. 更改了選擇專區的畫面
3. 更改了icon的樣式以及設定欄的些許樣式
4. 點選時候的反白更清楚的知道接下的步驟、導引、以及防錯(指的是進入使用者所想不同的專區)

結論

ArtsIgn是個非常好的想法，有助於全球的創作者聚在一起相互認識、並且交流，且不限於本身所使用的AI引擎。

雖然ArtsIgn目前只是啟動階段，但我相信這想法可以影響現有的創作平台。