<em id="09ttv"></em>
    <sup id="09ttv"><pre id="09ttv"></pre></sup>
    <dd id="09ttv"></dd>

        • UI設(shè)計(jì)師的“后設(shè)計(jì)工具時代”——Sketch、Figma、Adobe XD、Invision Studio

          2024-7-31    濤濤

           

           
           
           

           

           

           

           

           

           

          前幾天問一個做了7年UI設(shè)計(jì)的朋友

          “你用sketch嗎?”“不用”

          “你用XD嗎?”“不用”

          “你用figma嗎?”“不用”

          “你用invision Studio嗎”“啥?”

          “挺好的軟件,為什么不用用呢”“我用PS,PS最好了!”

          “MMP......”

           

          我們今天所處的環(huán)境,互聯(lián)網(wǎng)飛速發(fā)展,新的意識形態(tài)不斷涌現(xiàn),工作方式不斷發(fā)生變化,開放、共享等理念被更多的行業(yè)更多的人理解,在這樣的環(huán)境中效率顯得越來越重要。好的工具和工作方式帶來的是先進(jìn)的生產(chǎn)力,比如Figma的異軍突起改變了設(shè)計(jì)師傳統(tǒng)的工作方式也正在改變著我們的工作理念,作為互聯(lián)網(wǎng)設(shè)計(jì)師我們應(yīng)該是互聯(lián)網(wǎng)中的前衛(wèi)者。

           

          接下來我們看一下UI設(shè)計(jì)軟件的現(xiàn)狀和發(fā)展,不管有沒有去使用它們,但設(shè)計(jì)師應(yīng)該認(rèn)識到我們所處的環(huán)境。

           

           

           

           

           

           

           

           

           

           

          大約在90年代以前,我們可以給它起個名稱,叫做“軟件1.0時代”。“軟件1.0時代”軟件在自己的專業(yè)領(lǐng)域不斷的改進(jìn),比如Illustrator1.0、Photoshop1.0 ,word1.0、金山的wps1.0 等,此時的軟件最求的是功能的完善,系統(tǒng)的穩(wěn)定等。

           

           

           

           

           

           

           

           

          來到2000年左右,我們可以稱作“軟件2.0時代”。“軟件2.0時代”開始最求便捷高效的工作方式,多軟件協(xié)作,比如2002年Adobe的創(chuàng)意套裝Adobe Creative Suite,包括了今天大多數(shù)的Adobe軟件。

           

          1999年的WPS已經(jīng)集成了電子表格和多媒體演示,2001年更名為WPS Office。

           

          Microsoft office更早一些,在90年代就完成了從單一軟件到套裝的轉(zhuǎn)變。

           

           

           

           

           

           

           

           

           

          2010年前后我們可以稱作“軟件3.0時代”。隨著技術(shù)的發(fā)展和普及,這個時代的軟件開始加入“云”的理念,云端存儲,云端共享,比如2013年Adobe的創(chuàng)意云Adobe Creative Cloud也就是我們熟知的CC系列,一個賬號就可以在任意電腦上使用自己的資源。

           

          金山2012年推出WPS云文檔,2016年發(fā)布WPS+云協(xié)作,2018年多人實(shí)時在線協(xié)作的金山文檔上線(金山軟件的發(fā)展很好的體現(xiàn)了軟件的發(fā)展趨勢)。

           

           

           

           

           

           

           

           

           

          2013年至今,我們可以稱作“后軟件時代”或者“軟件4.0時代”,當(dāng)然這只是主觀的一個叫法,時間節(jié)點(diǎn)也未必科學(xué)。

          2013年

          ·訂閱號從無到有,成為內(nèi)容創(chuàng)業(yè)搶奪的藍(lán)海到市場逐漸飽和;

          ·為發(fā)燒而生的小米銷量開始被華為、OPPO、VIVO三家合力圍剿;

          ·Papi醬依靠短視頻吐槽拍出2200萬元“天價”廣告位后被邏輯思維撤資;

          ·滴滴與快的、優(yōu)步之間的燒錢大戰(zhàn)打的分外眼紅最后也喜結(jié)連理;

          ·ofo和摩拜平地一聲驚雷引發(fā)了出行領(lǐng)域的又一輪燒錢大戰(zhàn);

          ·4G拍照正式發(fā)放;

          ......

           

          這些和軟件并沒有太大關(guān)系,有些扯遠(yuǎn)了,跟軟件相關(guān)的是,2013年P(guān)rocessOn在線做圖工具的上線(國外同類型的產(chǎn)品出現(xiàn)的更早),ProcessOn是一款在線做圖工具,主要用來繪制流程圖,思維導(dǎo)圖等,團(tuán)隊(duì)成員可以實(shí)時協(xié)作。更重要的是ProcessOn一個web應(yīng)用,一個瀏覽器,一個窗口,全部搞定。ProcessOn在0銷售成本下用戶突破100萬。這在一定程度上折射出軟件的發(fā)展趨勢:云端化、去平臺化、共享化,傳統(tǒng)的軟件必將逐步被云應(yīng)用所替代。

           

           

           

           

          此后,國內(nèi)的墨刀和摹客2014年上線,國外的Figma 2015年上線,Adobe XD 2016年上線,2017年的國內(nèi)的xiaopiu上線,2020年9月xiaopiu推出“即時設(shè)計(jì)”,新版本的墨刀也加入了實(shí)時協(xié)作功能。看到國內(nèi)的設(shè)計(jì)軟件越來越優(yōu)秀,非常的高興和期待!2020年突如其來的變化,讓無數(shù)人居家辦公,團(tuán)隊(duì)協(xié)作,遠(yuǎn)程辦公等工具和理念被更多的人注意到......

           

          我們可以看到軟件的發(fā)展大致是這樣的線路:

           

           

           

           

           

           

           

           

           

          接下來我們看一下“后軟件時代”的UI設(shè)計(jì)軟件,今天要說的是目前主流的UI設(shè)計(jì)軟件——Sketch、Figma、Adobe XD、Invision Studio

           

           

           

           

           

          首先說明一下


          1、上面提到的墨刀和摹客也是非常非常優(yōu)秀的設(shè)計(jì)軟件,功能也非常的完善,甚至一些功能比這些軟件的體驗(yàn)還要好,墨刀摹客也是很好的選擇。不過我們更習(xí)慣把墨刀和摹客看做原型設(shè)計(jì)工具,所以不在討論范圍。


          2、還有一些很好的軟件比如Framer、Affinity Designer,也非常優(yōu)秀,但本人沒有深入體驗(yàn)過加之國內(nèi)使用者較少,所以不在討論范圍。


          3、大部分同學(xué)依然使用的是PS,但PS算不上正經(jīng)的UI設(shè)計(jì)工具(*^▽^*),雖然它很強(qiáng)大,所以也不在討論范圍。


          4、Sketch由于我們的使用環(huán)境所限,更像是一個傳統(tǒng)軟件,但它也為了保持競爭力不斷地更新迭代,也可以通過各種插件實(shí)現(xiàn)團(tuán)隊(duì)特有的工作流。


          5、Invision Studio是Invision眾多產(chǎn)品中的一個,Invision包括Invision Cloud、Invision Studio、Invision DSM

           

          “后軟件時代”的UI設(shè)計(jì)軟件具有共同的特點(diǎn)就是一站式設(shè)計(jì)——從線框、原型、設(shè)計(jì)、動效、討論到協(xié)作一站式完成。

           

           

           

           

           

          首先我們看一下這幾個軟件的基本信息:

           

           

           

           

          能夠發(fā)現(xiàn)這四款軟件的定位包括功能基本是一致的。

           

           

           

           

           

           

           

           

           

           

          1、基礎(chǔ)功能

           

           

          首先說一下基礎(chǔ)功能,所謂的基礎(chǔ)功能就是本地化設(shè)計(jì)常用的,圖形繪制、路徑編輯、布爾運(yùn)算、文本設(shè)置、圖層樣式、蒙版、模糊、頁面設(shè)置、柵格等,這些功能和基本的操作Sketch、Figma、Adobe XD、Invision Studio的差別不大,甚至很像,相對比較簡單,如果熟悉其中的一個其他的很容易上手,這里就不多做介紹。

           

           

           

           

           

          2、組件系統(tǒng)

           

          組件系統(tǒng),概況來說組件系統(tǒng)就是方便設(shè)計(jì)師對組件、樣式、顏色、文本樣式復(fù)用,可以統(tǒng)一修改。

           

          最近幾年組件化設(shè)計(jì)思維越來越被重視,各大廠都有自己的組件系統(tǒng),它是一種高效的工作方法及思維模式。關(guān)于組件化設(shè)計(jì)思維在這里就不再贅述,有興趣的同學(xué)可以看一下站酷的這幾篇文章 點(diǎn)擊標(biāo)題查看

          《組件化設(shè)計(jì)思維》

          《組件化設(shè)計(jì)思維 – 從規(guī)范到工具的構(gòu)建與探索》

          【滴滴平臺體驗(yàn)設(shè)計(jì)研究】設(shè)計(jì)的“整理術(shù)” —滴滴表單項(xiàng)目的組件化設(shè)計(jì)思維沉淀》

           

          它們的組件系統(tǒng)各有千秋,比如

          · Sketch、Figma、Invision Studio切換組件時可以下拉選擇切換,XD的切換是直接拖動組件到原來組件上替換,可以用斜杠 / 命名對組件進(jìn)行分組;

          · Figma、XD的組件可以有多種狀態(tài),并且可以直接識別到sketch文件的組件;

          · Sketch、Invision Studio把組件歸類到一個單獨(dú)的頁面空間;

          · Figma、XD的組件更靈活;

           

          當(dāng)然我們習(xí)慣一種就好,關(guān)鍵的是運(yùn)用到實(shí)際工作中!

           

           

           

           

          Adobe XD ↑

           

           

           

           

          Figma ↑

           

           

           

           

          Invision Studio ↑

           

           

           

           

          Sketch ↑

           

           

           

           

          Sketch ↑

           

          3、團(tuán)隊(duì)組件庫

           

          說到組件庫就不得不說團(tuán)隊(duì)組件庫,組件可以使設(shè)計(jì)師管理單個文件的設(shè)計(jì)資源,而團(tuán)隊(duì)組件庫可以使我們整個團(tuán)隊(duì)使用同一套規(guī)范,一個組件有所改動,所有用到這個組件的文件都會自動修改,這對于團(tuán)隊(duì)協(xié)作是至關(guān)重要的。

           

          Sketch的團(tuán)隊(duì)組件庫

          可以使用自帶的Sketch Libraries,也可以使用蘋果的iCloud ,藍(lán)湖為Sketch量身打造的“設(shè)計(jì)規(guī)范云”使用體驗(yàn)也是超級棒!

           

          Figma的團(tuán)隊(duì)組件庫

          Figma的團(tuán)隊(duì)協(xié)作本身就是大家共同編輯同一個文件,免費(fèi)用戶只能在一個文件里面使用組件,團(tuán)隊(duì)項(xiàng)目可夸設(shè)計(jì)稿使用,但需要是付費(fèi)的專業(yè)版。

           

          XD的團(tuán)隊(duì)組件庫

          把設(shè)計(jì)文件共享給團(tuán)隊(duì)成員,團(tuán)隊(duì)成員即可使用文件中的組件,并且可以共同編輯。

          我也會在我的教程 →《Adobe XD進(jìn)階使用教程》← 中講到

           

          Invision Studio的團(tuán)隊(duì)組件庫

          Invision Studio暫時沒有團(tuán)隊(duì)組件庫,但它可以導(dǎo)入其他文件的組件,我們可以通過文件傳送的方式間接實(shí)現(xiàn)組件的共享。

           

           

           

           

          Invision Studio ↑

           

           

           

           

          Adobe XD ↑

           

           

           

           

          Sketch ↑

          4、智能布局

           

          智能布局是“后現(xiàn)代設(shè)計(jì)軟件”的重要功能之一,它可以幫我們快速實(shí)現(xiàn)響應(yīng)式布局。

           

          雖然它們的叫法不一樣,但功能基本一致。

           

          · Sketch叫Smart Layout “聰明布局”;(這翻譯好別扭o(* ̄︶ ̄*)o)

          · Figma叫Auto Layout“智能布局”;

          · Adobe XD叫Content-Aware Layout“內(nèi)容感知布局”;

          · Invision Studio叫Responsive Layouts“響應(yīng)式布局”;

           

          其中Figma的Auto Layout可以實(shí)現(xiàn)更為復(fù)雜的效果,同時嵌套邏輯也更復(fù)雜。Invision Studio的Responsive Layouts的功能稍弱,只能實(shí)現(xiàn)一些簡單的自適應(yīng)效果。Invision Studio響應(yīng)式布局的核心是使用百分比的單位。

           

           

           

           

          Invision Studio ↑

           

           

           

           

          Sketch ↑

           

           

           

           

          Figma ↑

           

           

           

           

          Sketch ↑

          5、數(shù)據(jù)填充

           

          數(shù)據(jù)填充是我們做設(shè)計(jì)的時候經(jīng)常遇到的問題,就是填充一些頭像、圖片、文字等模擬的數(shù)據(jù),它可以使我們的設(shè)計(jì)效果看起來更真實(shí),代入感更強(qiáng)。數(shù)據(jù)填充可以分為兩大類型:

           

          一是隨機(jī)的數(shù)據(jù)

          隨機(jī)數(shù)據(jù)內(nèi)容不可控,它們都有這樣的插件,其中sketch自帶這個功能。

           

          二是自定義數(shù)據(jù)

          定義自己想要的文字和圖片。比如同時支持Figma、Adobe XD的Google Sheets插件。

           

          · Sketch可以自定義本地的圖片和文本或者使用插件如Kitchen等;

          · Figma可以通過Google Sheets插件實(shí)現(xiàn)自定義數(shù)據(jù),或者用其他插件進(jìn)行隨機(jī)數(shù)據(jù);

          · Adobe XD可以直接拖動本地的圖片和文本進(jìn)行填充,或者使用其他插件;

          · Invision Studio可以通過“Data”插件實(shí)現(xiàn)隨機(jī)數(shù)據(jù)或定義本地?cái)?shù)據(jù)。

           

           

           

           

          Adobe XD ↑

           

           

           

           

          Sketch ↑

           

           

           

           

          Figma ↑

          6、原型

           

          原型功能是一站式設(shè)計(jì)的不可或缺的功能。這一點(diǎn)Figma、Adobe XD、Invision Studio的體驗(yàn)是比較一致的。

           

          · 可以實(shí)現(xiàn)不同的交互方式如點(diǎn)擊、滑動、長按等等;

          · 可以實(shí)現(xiàn)不同的交互效果如緩入、緩出、線性等等;

          · 可以以連接的形式分享給他人;

          · 可以在手機(jī)上預(yù)覽并實(shí)際的操作;

           

          Sketch只能實(shí)現(xiàn)簡單的跳轉(zhuǎn)和過渡,當(dāng)然Sketch可以借助它的最佳拍檔Principle完成復(fù)雜的交互動效。

           

          Figma、Adobe XD可以實(shí)現(xiàn)帶有過渡效果的動效,也就是補(bǔ)間動畫。因此可以完成更真實(shí)的交互效果。

           

          Invision Studio的原型功能最完善,因?yàn)楸旧鞩nvision Studio就是同時借鑒了Sketch設(shè)計(jì)部分和principle動效部分,可以調(diào)整動效的關(guān)鍵幀以及動畫曲線。所以Invision Studio可以實(shí)現(xiàn)更復(fù)雜的交互效果。但I(xiàn)nvision Studio的彈性效果不能像Principle那樣自定義張力和摩擦力,也就是彈性幅度。

           

           

           

           

          Invision Studio ↑

           

           

           

           

          Invision Studio ↑

           

           

           

           

          Figma ↑

           

           

           

           

          Invision Studio ↑

           

           

           

           

          Invision Studio ↑

          7、實(shí)時協(xié)作

           

          實(shí)時協(xié)作是團(tuán)隊(duì)協(xié)作的重要體現(xiàn)。實(shí)時協(xié)作概況來說就是多人實(shí)時編輯同一個文件,就像打LOL一樣。它給我們帶來的不僅是工作流程的改版,也是逐步改變了我們的思考方式和工作方式。

           

          這也是很多軟件的發(fā)展趨勢,如各種協(xié)作文檔,前面提到的ProcessOn,以及最新版本的墨刀也增加了實(shí)時協(xié)作功能。相信實(shí)時協(xié)作將在不久的時間里大放異彩!

           

          在實(shí)時協(xié)作方面Figma無疑是在這四個軟件里面出現(xiàn)最早的,F(xiàn)igma也是非常的穩(wěn)定。

           

          Adobe XD緊隨其后,并且Adobe的實(shí)時協(xié)作體驗(yàn)也非常的不錯,不過免費(fèi)用戶只能兩個用戶編輯。

           

          Sketch也增加了實(shí)時協(xié)作,目前還在測試階段。

           

          Invision Studio的實(shí)時協(xié)作不是共同編輯設(shè)計(jì)稿,而是在設(shè)計(jì)稿上實(shí)時進(jìn)行涂鴉式的討論。

           

           

           

           

           

          Adobe XD ↑

           

           

           

           

          Figma ↑

           

           

           

           

          Figma ↑

           

           

           

           

          Invision Studio ↑

          8、工作交接

           

          工作交接可以分為三個方面

          一是設(shè)計(jì)分享,他人或者團(tuán)隊(duì)成員可以通過鏈接看到你的設(shè)計(jì)稿。

           

          二是設(shè)計(jì)討論,就像藍(lán)湖、Zeplin一樣,進(jìn)行打點(diǎn)的評論,@團(tuán)隊(duì)成員,回復(fù)等。

           

          三是交付前端,就像藍(lán)湖、Zeplin一樣,查看代碼信息下載切圖。

           

          Figma、Adobe XD、Invision Studio在工作交接上的體驗(yàn)是一致的,Invision Studio的設(shè)計(jì)討論更加靈活,可以進(jìn)行多人實(shí)時討論。

           

          Sketch也增加了這樣的功能,但由于我們的使用環(huán)境等問題,我們一般還是習(xí)慣借助藍(lán)湖等第三方軟件實(shí)現(xiàn)這樣的工作交接。藍(lán)湖也支持Adobe XD。

           

           

           

           

          Figma ↑

           

           

           

           

          Invision Studio ↑

           

           

           

           

          Figma ↑

           

           

           

           

          Invision Studio ↑

           

           

           

           

          Figma ↑

           

           

           

           

          Sketch ↑

          9、插件

           

          插件極大豐富了軟件的功能和軟件之間的協(xié)作。所以他們都很鼓勵更多的人開發(fā)插件。

           

          說到插件,不得不提到Sketch,由于Sketch用戶基礎(chǔ)廣,所以它有非常完善的插件生態(tài),也吸引了很多開發(fā)者創(chuàng)作插件。

           

          Figma、Adobe XD、Invision Studio雖然起步相對較晚,但他們的插件數(shù)量也在快速的增加。

           

          Sketch里非常優(yōu)秀的craft插件,就是Invision團(tuán)隊(duì)開發(fā)的。

           

           

           

           

          Sketch ↑

           

           

           

           

          Figma ↑

           

           

           

           

          Adobe XD ↑

           

           

           

           

          Invision Studio ↑

          10、資源

           

          這里說的資源包括:設(shè)計(jì)文件、作品、第三方控件、教程等。

           

          Sketch的資源是最豐富的,因?yàn)樗霈F(xiàn)較早,經(jīng)過了多年的發(fā)展,互聯(lián)網(wǎng)上已經(jīng)有非常多的關(guān)于sketch的資源。但大多集中在第三方網(wǎng)站,sketch官方資源較少。

           

          說到資源,不得不提到Figma社區(qū),F(xiàn)igma的社區(qū)集中了絕大部分的資源,包括作品、控件、插件等等,加上Figma本身云端的特性,使用起來非常的方便,比如插件,點(diǎn)一下安裝按鈕即可。

           

          Adobe XD也有自己的社區(qū),當(dāng)然這個社區(qū)不僅是是XD的,包含了Adobe的很多軟件,打開Creative Cloud 在Discover一欄就能看到相關(guān)的內(nèi)容。

           

          Invision Studio由于國內(nèi)使用者相對較少,所以資源也相對較少,特別是中文資源,Invision Studio的資源可以直接去它的官網(wǎng)查找。Invision Studio自帶的Studio App Store還處于bate版本,不過已經(jīng)收集了幾十套的文件資源和插件。

           

           

           

           

           

          Sketch ↑

           

           

           

           

          Figma ↑

           

           

           

           

          Adobe XD ↑

           

           

           

           

          Invision Studio ↑

           

           

           

           

           

           

           

           

          如果分別用一句話總結(jié)他們的核心特點(diǎn),那就是:

          · Sketch群眾基礎(chǔ)強(qiáng)大,“功能不夠,插件來湊”,Mac獨(dú)寵

          · Figma云端軟件,協(xié)作無敵

          · Adobe XD 大廠軟件,多軟件協(xié)作便捷

          · Invision Studio設(shè)計(jì)與動效融為一體

           

           

           

           

          Sketch是最早在UI設(shè)計(jì)師中流行的一款軟件,但被只能在mac電腦上使用,這就把很多人拒之門外。Sketch受到后起之秀Figma、Adobe XD很大的沖擊,但也促使sketch更好的發(fā)展,比如也開始加入實(shí)時協(xié)作。但不能否認(rèn)Sketch目前仍在UI設(shè)計(jì)工具中占據(jù)首位。

           

          由于Sketch需要付費(fèi)使用,加之我們的使用環(huán)境,它自帶的很多功能我們并用不上或者不好用,我們可以借助插件完成。Sketch的插件系統(tǒng)十分強(qiáng)大,很多工具都有為sketch開發(fā)插件,像藍(lán)湖設(shè)計(jì)規(guī)范云、墨刀、摹客等等。

           

          關(guān)于Sketch的教程網(wǎng)上非常多,可以在B站上搜索sketch,會有非常多優(yōu)秀的教程。比如

          像素范https://space.bilibili.com/15741969/

          新像素 https://space.bilibili.com/389903587/

          優(yōu)設(shè)基礎(chǔ)訓(xùn)練營https://space.bilibili.com/39990344

           

           

           

           

          Figma是“后軟件時代”的典型代表。云端、社區(qū)、協(xié)作等特點(diǎn)使他能夠在短時間內(nèi)被行業(yè)追捧。不管你認(rèn)不認(rèn)同這種趨勢,它就在那。

           

          但就我們國內(nèi)的使用環(huán)境,還存在一些不好的體驗(yàn):

           

          一是被很多人詬病的依賴網(wǎng)絡(luò)問題,就算有網(wǎng)也可能加載較慢,可能還需要更科學(xué)的上網(wǎng)方式。這一點(diǎn)體驗(yàn)確實(shí)不好,不過并不影響它的正常使用。但作為UI設(shè)計(jì)師難道不應(yīng)該經(jīng)常去看一些設(shè)計(jì)網(wǎng)站嗎,科學(xué)的上網(wǎng)方式不應(yīng)該是我們UI設(shè)計(jì)師的一項(xiàng)基本技能嗎?

           

          二是前端交付問題,它不支持藍(lán)湖,或者說藍(lán)湖不支持Figma,我們國內(nèi)很團(tuán)隊(duì)都在使用藍(lán)湖,這一點(diǎn)使得它的遷移成本較高。

           

          Figma比較出名的是它的實(shí)時協(xié)作,多個人同時編輯一個文件,這種體驗(yàn)真的很棒。

           

          關(guān)于figma的教程,我自己精心錄制了一套完整的figma教程,從基礎(chǔ)操作,到高級使用技巧,再到交互動效制作,是一套非常系統(tǒng)的課程,墻裂推薦哦~《figma教程》點(diǎn)擊查看

           

           

           

           

           

          Adobe XD的路徑編輯很弱,連輪廓化描邊都需要借助插件,詢問Adobe官方,回答是后續(xù)可能會增加這樣的功能,目前讓從AI導(dǎo)入,或者使用Astui插件,好吧,畢竟是大佬,你說的算。

           

          · Adobe XD的實(shí)時協(xié)作需要軟件版本一致。

          · Adobe XD的重復(fù)網(wǎng)格+自定義數(shù)據(jù)填充很方便。

          · Adobe XD還有一個顯著的特點(diǎn)就是屬于Adobe系列,多軟件協(xié)作特別方便,比如直接在ps里面編輯位圖,直接導(dǎo)入AI文件,直接導(dǎo)出到AE去做交互動效。

          · Adobe XD的組件和共享用不了,這個問題很好解決,在我的教程里會講到。

           

          關(guān)于Adobe XD的教程,網(wǎng)上也有很多的優(yōu)秀資源,比如牛MO王老師的XD教程→。但這些教程并沒有詳細(xì)講到團(tuán)隊(duì)組件、協(xié)作等。所以我自己做了一些教程《Adobe XD進(jìn)階使用教程》,還在陸續(xù)更新,歡迎大家學(xué)習(xí) 傳送門→

           

           

           

           

          · Invision Studio最大的特點(diǎn)就是直接做動效,就像是sketch+principle的合體。

          · Invision響應(yīng)式布局的核心是用百分比的單位;

          · 目前沒有多人實(shí)時編輯,但有多人實(shí)時討論;

           

          Invision Studio是Invision眾多產(chǎn)品中的一個,Invision包括Invision Cloud、Invision Studio、Invision DSM。

           

          其中的Invision DSM的服務(wù)對象是Sketch,簡要來說就像是藍(lán)湖為Sketch做的設(shè)計(jì)規(guī)范云。或者應(yīng)該說設(shè)計(jì)規(guī)范云像Invision DSM;Invision Cloud還包括了Craft插件,Craft是使用在ps和sketch上的插件。

           

          關(guān)于Invision Studio的教程,網(wǎng)上資源相對較少,如果你使用過前三個軟件,那么只需要熟悉和習(xí)慣一下操作就完全可以上手。也可以去它的官網(wǎng),有詳細(xì)的使用方法和視頻。

           

           

           

           

          只要不是用ps就是進(jìn)步

           

          1、根據(jù)團(tuán)隊(duì)使用情況選擇

           

          2、如果是萌新用戶建議選擇Figma或Adobe XD

           

          3、如果網(wǎng)絡(luò)不允許可以選擇Adobe XD或Sketch

           

          4、如果想探索更多的不同可以選擇Invision Studio

           

          5、至少可以選擇Adobe XD+藍(lán)湖

           

          他們都存在體驗(yàn)不好的地方,但他們都在快速的更新,這也很好的體現(xiàn)了快速迭代的產(chǎn)品思維。

           

           

           

           

          上面提到的軟件功能大部分經(jīng)過親自測試,難免有錯誤和不足歡迎大家指正!

           

          就在我寫這篇文章的同時,Adobe在10月20日召開了一年一度的Adobe MAX大會,大會的主要內(nèi)容是:新應(yīng)用,新功能以及更快,更輕松的協(xié)作方式。有興趣的同學(xué)可以看一下這個60秒的短片 點(diǎn)擊查看

           

          也是在10月20日Adobe XD發(fā)布了34版本,這個版本的新增功能有:3D變換、組件嵌套、用于團(tuán)隊(duì)協(xié)作的Creative Cloud庫、增強(qiáng)智能布局、共同編輯從bate版變?yōu)檎桨妗⒏嗟牟寮?/p>

           

          3D變換除了做一些帶透視的設(shè)計(jì),還可以結(jié)合Adobe XD的自動動畫做出來更多的效果,以下是我的一些簡單的嘗試,期待大家創(chuàng)作更多腦洞大開的效果。

           

           

           

           

           

           

           

           

           

           

           

           

           

           

           

           

           

           

          組件的嵌套可以使Adobe XD像Sketch和Figma一樣實(shí)現(xiàn)更復(fù)雜的效果。

           

          最令人欣喜的是它智能布局增加了自動高度文本,這使得Adobe XD的智能布局更趨近Figma,配合組件嵌套給我們提供了更多的創(chuàng)作空間。

           

           

           

           

           

           

           

           

          Sketch在10月份也更新了69版本,增加了助手、字體嵌入、組件管理等功能。

           

          Figma最近也更新了很多功能,如優(yōu)化了組件調(diào)用、增強(qiáng)原型等,并預(yù)計(jì)在11月份更新Auto Layout功能。

           

           

           

          參考資料

          wps的發(fā)展歷程

          Office辦公軟件發(fā)展簡史

          您不知道的Microsoft Word歷史版本

          Adobe公司的發(fā)展史

          Adobe維基百科

          ProcessOn

          成了國民應(yīng)用的在線文檔,2020年走向何方?

           

           

          作者:丁小祥
          鏈接:https://www.zcool.com.cn/article/ZMTE4NzE1Ng==.html
          來源:站酷
          著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請注明出處。

           

           

           

           

          藍(lán)藍(lán)設(shè)計(jì)(m.sdgs6788.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)B端界面設(shè)計(jì)桌面端界面設(shè)計(jì)APP界面設(shè)計(jì)圖標(biāo)定制用戶體驗(yàn)設(shè)計(jì)交互設(shè)計(jì)UI咨詢高端網(wǎng)站設(shè)計(jì)平面設(shè)計(jì),以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。

          關(guān)鍵詞:UI咨詢UI設(shè)計(jì)服務(wù)公司軟件界面設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)公司UI交互設(shè)計(jì)公司數(shù)據(jù)可視化設(shè)計(jì)公司用戶體驗(yàn)公司高端網(wǎng)站設(shè)計(jì)公司

          銀行金融軟件UI界面設(shè)計(jì)能源及監(jiān)控軟件UI界面設(shè)計(jì)氣象行業(yè)UI界面設(shè)計(jì)軌道交通界面設(shè)計(jì)地理信息系統(tǒng)GIS UI界面設(shè)計(jì)航天軍工軟件UI界面設(shè)計(jì)醫(yī)療行業(yè)軟件UI界面設(shè)計(jì)教育行業(yè)軟件UI界面設(shè)計(jì)企業(yè)信息化UI界面設(shè)計(jì)、軟件qt開發(fā)軟件wpf開發(fā)軟件vue開發(fā)

          日歷

          鏈接

          個人資料

          存檔

          久久久这里只有精品加勒比| 精品综合久久久久久97| 国产午夜久久影院| 久久综合中文字幕| 久久久精品久久久久特色影视| 久久久精品久久久久久 | 久久人人爽人人爽人人片AV不 | 久久久久香蕉视频| 77777亚洲午夜久久多人| 国产精品久久久久久福利69堂| 色婷婷噜噜久久国产精品12p| 无码精品久久久久久人妻中字| 精品久久久久久国产免费了| 中文精品久久久久人妻不卡| 久久人人超碰精品CAOPOREN| 久久国产欧美日韩精品| 一本久道久久综合狠狠躁AV| 国产精品久久久久影院嫩草| 亚洲精品国产第一综合99久久| 成人午夜精品久久久久久久小说| 伊人久久精品无码av一区| 久久黄视频| 精品人妻伦九区久久AAA片69| 午夜欧美精品久久久久久久| 亚洲午夜精品久久久久久浪潮| 国产激情久久久久影院| 国产精品久久自在自线观看| 色欲久久久天天天综合网| 色偷偷88欧美精品久久久| 久久久久婷婷| 欧美精品丝袜久久久中文字幕| 国产精品综合久久第一页| 青草影院天堂男人久久| 国产精品美女久久久久网| 91精品国产综合久久久久久| 久久亚洲精品中文字幕| 久久精品国产亚洲精品2020| 久久久久人妻精品一区二区三区| 天天爽天天狠久久久综合麻豆| 性色欲网站人妻丰满中文久久不卡| 麻豆成人久久精品二区三区免费|