AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

前言

目前,人工智能技術(shù)的發(fā)展已經(jīng)取得了令人矚目的成就。不論是自然語言處理還是計(jì)算機(jī)視覺,人工智能都有了顯著的進(jìn)展。就視覺設(shè)計(jì)師而言,我們不得不承認(rèn) AI 通過不斷的算法學(xué)習(xí)與技術(shù)更新,其生成的圖像著實(shí)令人驚嘆,但我們也不難發(fā)現(xiàn),當(dāng)下 AI 繪圖還是有很多的局限性,比如生成質(zhì)量不穩(wěn)定、缺乏抽象能力等。

那么本文也將延續(xù)前文《AIGC 對設(shè)計(jì)行業(yè)的影響與啟發(fā)》、《AI 在 UX 設(shè)計(jì)流程中的應(yīng)用大全》,繼續(xù)談一談 AI 在視覺設(shè)計(jì)工作中的應(yīng)用。

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

一、AI 繪圖能代替視覺設(shè)計(jì)師嗎?

在實(shí)際使用中我們發(fā)現(xiàn),AI 往往對于具象的需求表現(xiàn)得更好,而對于抽象需求表現(xiàn)得較差。

比如,AI 可能無法穩(wěn)定地繪制出如下靠左的相機(jī)圖標(biāo),但可以快而穩(wěn)定地繪制出右邊的相機(jī)圖像,而人工去繪制右邊的相機(jī)可能至少需要一天,還不一定有 AI 的效果好。

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

因此作為視覺設(shè)計(jì)師,AI 繪圖充當(dāng)?shù)囊琅f是協(xié)作伙伴的角色,而實(shí)際的產(chǎn)出還是依賴于我們本身的設(shè)計(jì)判斷和審美能力。

但哪怕僅僅只是這點(diǎn),它能所帶來的改變也是無與倫比的。

以往面對大部分的設(shè)計(jì)需求,設(shè)計(jì)師首先需要在網(wǎng)上搜尋大量的參考,進(jìn)行腦暴、制定情緒版、確定設(shè)計(jì)風(fēng)格,然后才能開始設(shè)計(jì)。期間還要與需求方唇槍舌戰(zhàn)、來回改稿。而現(xiàn)在我們通過輸入指令、圖片和相關(guān)信息,AI 工具就可以快速生成滿足需求的視覺內(nèi)容,這可以極大地縮減整體設(shè)計(jì)的時(shí)間。

而這種變革與提效,也正是 AI 為我們帶來的最大價(jià)值。

二、什么 AI 工具更好用?

當(dāng)前市面有非常多的 AI 繪圖軟件可供選擇,典型如 Midjourney、Stable diffusion、Dall E 等,多是基于大模型通過文生圖、圖生圖的方式得到結(jié)果。

其中,Stable diffusion 的學(xué)習(xí)成本和部署難度不太友好,Dall E 的能力和可控度都相對較弱,Midjourney 算是其中綜合能力較強(qiáng)且上手難度較低的選擇。

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

下面我們也將以 Midjourney 為例,來為大家展現(xiàn) AI 工具在視覺設(shè)計(jì)需求中的實(shí)際使用。

三、如何在產(chǎn)品視覺設(shè)計(jì)流程中應(yīng)用 AI?

目前在群核科技的視覺設(shè)計(jì)團(tuán)隊(duì)內(nèi)部,AI 輔助設(shè)計(jì)工作已經(jīng)有一段時(shí)間了,從前期需求溝通到設(shè)計(jì)方向確認(rèn)、再到設(shè)計(jì)產(chǎn)出和調(diào)整都有對于 AI 工具的應(yīng)用。

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

下面我們將從兩個(gè)實(shí)際案例出發(fā),來為大家進(jìn)行 AI 應(yīng)用的展示:

案例一、VIP 會(huì)員日

Step1 需求溝通

①使用飛書妙計(jì)進(jìn)行會(huì)議記錄,并使用 ChatGPT 總結(jié)需求(示意)

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

②使用即時(shí) AI/UIzard 生成頁面框架,并確定需要由 AI 生成的主畫面內(nèi)容(示意)

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

Step2 設(shè)計(jì)方向

①使用 Chatgpt 輔助構(gòu)思核心創(chuàng)意

②書寫中文自然語言,讓 ChatGPT 翻譯成標(biāo)準(zhǔn)的提示詞

輸入主畫面描述:

畫面的中心是一個(gè)圓形平臺,周圍是城市中的高樓大廈,白色背景和白色建筑

得到英文文案:

The center of the picture is a circular platform surrounded by tall buildings in the city, with a white background and white buildings

添加風(fēng)格,材質(zhì)以及圖像參數(shù)設(shè)定

風(fēng)格:藝術(shù) 3D,pop mart,,c4d

材質(zhì):粘土材料

參數(shù):高品質(zhì),8k --s 50 --ar 16:9 --style scenic --niji 5

最終得到完整的提示詞文案:

The center of the picture is a circular platform surrounded by tall buildings in the city, with a white background and white buildings,Pop Mart and Cinema 4D,create 3D characters with cartoon-style,best quality,clay material,8k --s 50 --ar 16:9 --style scenic --niji 5

③輸入提示詞,用 Midjourney 產(chǎn)出相對應(yīng)的風(fēng)格圖片

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

Step3 設(shè)計(jì)素材

①基于情緒版提案,輸入初步確定方案的提示詞和相關(guān)風(fēng)格圖片,產(chǎn)出對應(yīng)圖片素材

提示詞:

主體:畫面中心是一個(gè)圓形平臺,周圍是城市中的高樓大廈

場景細(xì)節(jié):白色背景和白色建筑,金線裝飾著建筑

風(fēng)格:藝術(shù) 3D,pop mart,c4d

材質(zhì):粘土材料

參數(shù):高品質(zhì),8k--s 50-ar 3:4--niji 5--niji 5The center of the picture is a circular platform surrounded by tall buildings in the city, with a white background and white buildings,Gold lines adorn the building,Pop Mart and Cinema 4D,3D characters,best quality,clay material,8k --s 50 --ar 16:9 --style scenic --niji 5

墊圖:

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

②多次調(diào)試得到滿意的初稿,挑選合適方向的畫面進(jìn)行二次調(diào)整

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

③最終選取以下圖片為最終素材

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

Step4 設(shè)計(jì)產(chǎn)出

①將選定素材進(jìn)行調(diào)色處理、局部調(diào)整

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

②根據(jù)畫面需要,使用 MJ 生成裝飾圖形,并在群核星辰素材平臺找到適合主題的 IP 形象

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

③合成畫面,加入 UI 界面元素,整體調(diào)整并輸出最終視覺稿

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

案例二、認(rèn)證中心探索

Step1 需求溝通

①使用飛書妙計(jì)進(jìn)行會(huì)議記錄,并使用 ChatGPT 總結(jié)需求

②使用即時(shí) AI/UIzard 生成頁面框架,并確定需要由 AI 生成的主畫面內(nèi)容

Step2 設(shè)計(jì)方向

①找到合適風(fēng)格和構(gòu)圖的靈感圖

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

Step3 設(shè)計(jì)素材

①基于情緒版提案,輸入初步確定方案的提示詞和相關(guān)風(fēng)格圖片,產(chǎn)出對應(yīng)圖片素材

主體:魔方顆粒

材質(zhì):磨砂玻璃白色丙烯酸材料

背景:黑色背景

風(fēng)格:透明科技感

參數(shù):8k,-iw 1-v 5-q 2-ar 16:9

Rubik's Cube Particle,frosted glass white acrylic material,white beckground,transparent technology sense,8k,—iw 1 —v 5 —q 2 —ar 16:9

墊圖:同上

②多次調(diào)試得到滿意的初稿,挑選合適方向的畫面進(jìn)行二次調(diào)整

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

Step4 設(shè)計(jì)產(chǎn)出

①合成畫面,加入 UI 界面元素,整體調(diào)整并輸出最終視覺稿

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

四、AI 還能為我們帶來什么?

AI 工具所能帶來的顛覆性變化毋庸置疑,但我們也發(fā)現(xiàn)了一個(gè)問題,在設(shè)計(jì)同學(xué)利用 AI 工具進(jìn)行業(yè)務(wù)產(chǎn)出時(shí),大家的設(shè)計(jì)風(fēng)格愈加地不統(tǒng)一,包括每個(gè)案例間的共性和差異都是盲盒。

所以我們也藉由 AI 探索小組的契機(jī),去對一段時(shí)間內(nèi)的產(chǎn)出進(jìn)行了搜集與歸類,并將盲盒拆開,沉淀出了 AI 指令庫。畢竟業(yè)務(wù)在設(shè)計(jì)規(guī)范的框架下,設(shè)計(jì)產(chǎn)物都是指向明確且可被復(fù)制的。

而通過 AI 指令庫,我們可以快速定位到類似案例,并通過指令準(zhǔn)確地生成我們想要的產(chǎn)物。

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

總結(jié)

以上是我們在視覺設(shè)計(jì)工作中應(yīng)用 AI 的一些探索,雖然 AI 概念已經(jīng)從熱轉(zhuǎn)冷,但整個(gè)行業(yè)其實(shí)仍處于起步階段。未來 AI 會(huì)怎么發(fā)展?我覺得大概有三點(diǎn):

  1. 能力增強(qiáng):硬件必然會(huì)提升,AI 也將持續(xù)提升技術(shù)水平,不僅僅是生圖的快速和準(zhǔn)確,還包括增強(qiáng)學(xué)習(xí)、遷移學(xué)習(xí)和自適應(yīng)學(xué)習(xí)。
  2. 交互升級:不局限于當(dāng)前文生圖、圖生圖的方式,語音、視頻等自然語言處理技術(shù)的發(fā)展將使人與 AI 之間的交互更加多變且順暢。
  3. 門檻降低:隨著行業(yè)發(fā)展和各方入局,未來的使用門檻必定會(huì)進(jìn)一步降低,包括也會(huì)隨著競爭而使其擁有更準(zhǔn)確和定制化的服務(wù)和產(chǎn)品。

當(dāng)然,時(shí)代一直在轉(zhuǎn),不知道什么時(shí)候新的變革就會(huì)到來,我們裹挾其間,只能不斷改變自己以更加適應(yīng)時(shí)代。

保持熱愛、積極擁抱,謹(jǐn)此獻(xiàn)給仍處一線卻依舊迎難而上的每個(gè)我們。

歡迎關(guān)注作者微信公眾號:「群核科技用戶體驗(yàn)設(shè)計(jì)」

AI如何應(yīng)用到產(chǎn)品視覺設(shè)計(jì)流程中?來看獨(dú)角獸團(tuán)隊(duì)的實(shí)戰(zhàn)案例!

收藏 139
點(diǎn)贊 65

復(fù)制本文鏈接 文章為作者獨(dú)立觀點(diǎn)不代表優(yōu)設(shè)網(wǎng)立場,未經(jīng)允許不得轉(zhuǎn)載。