您現在的位置是:電腦技術吧?>? 基礎知識 ??>??平面設計師,什么叫平面設計師??>??正文詳情

平面設計師,什么叫平面設計師

公博雅2019-11-23 14:21:27 人圍觀
簡介平面設計師職責隨著HTML5的普及,平面設計師該怎么做?今天,epub360從設計內容、表現技巧和理念三個方面,來談談平面設計師如何在這股浪潮中成功站穩腳跟。文章附有大量的實平面

Html 5這么吃香,平面設計師該做點什么?今天Epub360筆者從設計內容、表現技巧和觀念三個方面,聊聊平面設計師該如何在這次浪潮中成功站穩腳跟,文中附上大量實戰案例,不談空話干貨滿滿。

想成為Html 5風口上的一只豬?來學習下這篇!  寫在前面的話,因為互聯網行業的介入,很多行業的一貫法則都發生了變化,比如零售、金融、地產、汽車、通訊、旅游等等平面設計師作為各行業中比較下游的一個崗位,不管是被客戶上司逼被還是平日的潛移默化,其實也多少受到互聯網的影響,感知風向起步較早的一批甚至已經蛻變到了移動端的設計師,任職于大型互聯網企業UI、UE,這里暫且不表。

  因為筆者這只笨鳥也還在摸索的道路上,在這里談的算不上什么建議,只是一些血淚史(有血有淚),設計行業變化很快,不過總結起來也不出三大塊:  內容  表現技巧  觀念觀念還是觀念  一、先來說說隔靴搔癢的內容  前平面設計師做的比較多的工作,比較常見是設計logo、VI系統里七七八八的東西、catalog、包裝以及印刷的七七八八的東西除此以外就是專門的網頁設計師。

除了內容不知所云的印刷品和層級多到爆的網頁,其他設計項目都比較抽象,比如最常見的logo設計。

只言片語的線索,要求高端大氣上檔次~開搞!這樣一向情愿的鴕鳥效應在H5廣告上倒是不會有,因為一般投H5廣告和傳統設計最大不同是kpi那座大山!折頁、名片印出來可以往桌角一擱完事,H5廣告這樣pm就要殺人了好么?

  大眾點評 我們之間就一個字案例體驗:

  雖說內容并不是設計師可以控制,(大不了文案不好大圖湊)不過設計師還是可以給予內容編輯一些建議,  比如開篇、序言、轉折部分要給頁面足夠的空間,不要吝嗇空白頁(也叫調劑頁,點到為止不然有放水嫌疑),有時一個頁面擺一句文案就足夠提氣;描述產品部分請直奔重點也就是產品本身,如果有翔實的數據支持,文案結構對稱那么你可以偷笑了:遇到了一個好copy,這樣的內容可以為作品加分。

相反什么得過國際大獎,名師設計,進口材質,綠色生產過程,阿貓阿狗用了都說好面面俱到的文案還是盡可能少一點。

在不脫離內容的基礎上,還是建議設計師們盡可能加入內容的梳理工作中,比如試試把傳統的標題整成可點擊的標簽(tag),把slogan整得更口語化,大段的條目文字配合圖片做成幻燈輪播,或者逐條的動畫進入,看著也就沒那么煩了。

畢竟大家都沒有那么多時間一本正經看大段文字。

  二、表現技巧,斷舍離  首先設計師得有這樣的概念,H5廣告的和投放成本比網頁和印刷品都要大得多,時效性上一朝一夕就over了,總之它比較金貴。

在有限的手機屏讓傳播效益最大化就是表現的活兒了。

視覺傳達依然離不開平面的基礎:構圖、色彩、空間。

黃金分割自不必贅述,但是到移動端上主題元素居中突出更不會犯錯;經典的幾何構圖比如穩定的正三角形、圓形、正方、二、三等分構圖,傾斜、幾何形構圖搭配輔助圖形會產生不穩定感,但也會有年輕、銳氣的感官,而邊緣化構圖會讓作品顯得更加老辣。

  上述的構圖法往往在傳統的平面設計上用到概率比較少,就算偶爾大膽嘗會被要求和其他元素融合一下或者用什么東東破一下,甚至最后改回一張大圖。

傳統平面設計上更多是為品牌形象,產品格調服務,所以視覺元素、畫面層次較豐富,而在H5廣告的設計則盡量保持視覺主體的單純性。

  華為:中國智慧 觸控未來Mate S新品上市案例體驗:

  這里要提一下字體設計,它既是內容設計也是構圖設計,一款成功的title設計本身就可以hold住畫面。

  而一個精雕細追的畫面脫離了標題未必可以hold住主題。

  色彩也有了比較大的顛覆,我們所看見的大量紅配綠、藍配黃的撞色搭配越來越多,以及熒光色也時不時來湊熱鬧啦,這種在以往設計領域被視為深井冰的配色搖身一變成了怪咖潮范的經典。

其次是大面積黑白灰的配合也很常見,優雅的黑白照片再度被大量啟用,(黑白大圖壓大字成為一句半調侃半真理)換了以前把領導照片p成黑白的你試試可以用那么多犀利的顏色還不用擔心輸出、色差問題也是得益于移動大屏設備的普及。

HSB色板漸漸代替了傳統印刷領域的cmyk色板,以及大面積的純色代替漸變色,畢竟互聯網上的色彩需要單純、明確、有情緒。

  空間的表現比上述都要復雜一些,處理好構圖和色彩依然還停留在平面設計范疇,沒有空間時間的流動就不能體現H5的真正魅力。

在平面上模擬空間流動也是有幾種方法的:視差效果,前景和背景在屏幕滾動時位置的差異等。

  還有些做法是巧妙利用了素材,通過假3d畫面素材,搭配和基本的放大縮小移動這些動畫,依然可以營造出簡單輕量級的空間感。

  如果設計師會3d軟件那么想象力完全可以火力全開,建模渲染一個場景作環境,搭配上序列幀利器和各種觸發,場景再現妥妥的。

  空間的表現依然需要統一和單一,雖然H5作品可以在多個頁面翻轉,但是場景不宜轉換過多。

  上述內容和表現技巧兩2點還僅僅停留在圍繞視覺感官的工作,探討下H5相比平面媒介的從整體感官上不同,舉幾個栗子:  大眾點評:海外游你還帶著厚厚一疊攻略?

  案例體驗:

  滴滴順風車:測測堵車傷殘指數

  案例體驗:

  其實熟悉為微信H5的小伙伴應該已經看出來了,以上是典型的測試題類H5,但是通過噱頭的畫面和戲劇性的文案,測試題主線顯得絲毫不違和,反而讓人對過程有所期待看到結果時會心一笑。

  再來看些全程和用戶互動的栗子:  美年達滴滴畫臉

  案例體驗:

  Nike 科比逆天瞬殺極速測試

  案例體驗:

  京東金融:躺著也能掙錢

  案例體驗:

  杜蕾斯的第一座美術館

  案例詳情:

  以上,通過劍走偏鋒的切入點來貼合主題,案例展現出前所未有的用戶體驗,美、玩味、懸念、儀式感等等。

作品自然經過大量的人力物力,并不是一兩位平面設計師就能實現的了,那么我們從中可受到怎樣的啟發?既然各行各業觸網的大趨勢不可逆轉,接下來聊聊平面設計師轉型。

  三、知識體系和觀念的迭代  傳統的平面設計師的應用知識:修圖、排版(輸出印前流程和網頁排版規范)字體設計圖形插畫設計、色彩心理學、web端還涉及到html css代碼等,相信全面掌握這些的設計師已經是資深設計師并且在工作中可以獨當一面。

這樣的設計師初入交互領域,還是需要學習不少知識,比如常見的畫布尺寸和最小單位以及最后交付的完稿文件都有了變化,除此以外大家會感受到: H5的設計更像個活物,不僅僅頁面的每個角落帶有響應,甚至作品的線性空間內都可以相互影響。

所以要求設計師的打破一維思維狀態,由單純的視覺維度轉向用戶交互界面繼而將時空等客觀環境因素都考慮進去,歸納來說:線型思維轉向發散性思維。

  再來看下交互設計師的總體知識體系:

  這里不難得出視覺設計只占據很小一部分,前道需求分析和流程設計往往都有其專門的崗位來負責,剩下的原型部分和可用性測試還是會和設計師的工作有交集,甚至由平面設計一起包攬。

假如你接受了這個挑戰,就不光要著眼于畫布上那些元件和圖層。

設計工作完成(只代表完成了一半),還需要切圖優化素材在線平臺重新置入素材動畫設置觸發事件設置頁面關系調整輔助元素(LOGO交互提示音樂)的設置以及不下幾十次的在線測試優化。

總體工作量遠大于單純的平面設計,操作熟練的設計師可以在1-2天完成設計和所有動銷交互,憑的不光是手速和軟件的熟練度,還有對總體流程了然于胸。

例如:幻燈和普通原件在切圖上的區別,動畫制作中哪里用幻燈哪里該用序列幀,循環動畫的觸發是不是存在不合理?這些話題每天都在被討論著,而就在這些細微處,用戶之間的距離也漸漸拉開了。

  常常看見一些年輕設計師吐槽:項目經理把一個文檔丟過來,慘無人道要求在兩天時間里做出一個H5云云。

其實個人覺得除了工作量的陡增這未必是件壞事,至少說明經理信任你,你可以展現自己的執行和文字解讀能力,注意在制作過程必要節點和項目負責人進行匯報和及時溝通。

溝通的重要性在H5制作中不容忽視,主張設計師們利用各種工具來表達自己的想法。

這里可推薦的小工具有,Axuremindmanage php?/PowerPoint/' target='_blank'>PPT Keynote以及我們手中的紙和筆。

  理解和協調整體的能力  上述幾個著名案例,展現點不同表現風格各異,拆解單個作品的元素細節非常協調,小到icon、筆觸的擺放都經過了考慮也就是再設計,最終達到視覺上自成一套體系。

這里的規范統一又區別于vi和畫冊的絕對統一,形象講:不需要再為了app里一個轉角死扣像素或者制作一本catalog反復比對行距和潘通色值,因為我們的互聯網傳播更快餐,大多數用戶不會注意這些只有執行者才看得出的區別。

然后這并不代表設計師可以偷工減料,雖然在單一頁面上的花費時間減少,不過H5作品的整體關聯性會讓我們為一個頁面上的疏忽而付出全局的代價,就好像使用0代碼基礎的第三方平臺來制作H5那樣,如果對一些基本知識的認識不足,到后期會出現各種狀況,這些都是設計師在轉型中要面對的。

  好比說H5商業作品是一個立方體,視覺部分是立方體中的其中一面,那么營銷企劃、用戶體驗、特效制作、文案雕琢、媒體投放等構成了這個立方體的另外五面,各項活做得越扎實作品越飽滿,也越接近廣告目標。

各環節的溝通不順暢各自為政,那么可以聯想到六面體會是只有表面文章的花架子,當然花架子總好過只有一兩面的紙片兒。

再回顧下交互設計師的知識體系,如好學的小伙伴們不滿足于平面設計這個小面,習慣用交互設計師的視角去考慮每一個頁面,那么對整體作品乃至我們的職業道路都可以加分。

  那么問題來了,如何用交互設計理論體系來衡量H5作品的好壞呢,這里提幾個常見標準供大家參考:項目核心要傳達的是晦澀還是鮮明;視覺中心是否夠直接明了,圖形元素是否會有歧義或帶來不適感;交互的設置是否能讓用戶用得順手,如不順手是否進行了必要的解釋;動畫特效是否會卡頓滯后,各種平臺的兼容測試多站在用戶角度來審視作品,很多問題在前期就可以被規避。

設計師們也可以通過各種渠道加強理論學習,比如至少通讀下iOS 人機界面指南吧~ios的體系確實有其獨到的考慮和魔鬼細節,這里不是神化蘋果,不管怎么說蘋果公司小到門店一個展柜大到產品發布會模式都被抄襲了不下一百遍啊一百遍。

  不得不面對的現狀,事實上在需求分析擬定階段就可能牽扯到交互,也就是交互的前置化,比較遺憾的是,一般公司PM/AM在此階段很少讓設計人員參與進來,導致溝通執行之間出現斷層。

不過在機遇與挑戰并存的互聯網時代,設計師的地位逐漸回到本位,只要愿意做,機會就在你身邊。

版權聲明:本文由 公博雅 整理編輯。

原標題:找平面設計師,平面設計師主要做什么

轉載注明出處:http://www.dn9ww09s.icu/basics/14078.html

文章評論

    共有條評論來說兩句吧...

    用戶名:

    驗證碼:

作者推薦

  • 不壓縮文件夾設置密碼,如何給文件夾設置密碼 電腦

    不壓縮文件夾設置密碼,如何給文件夾設置密碼 電腦 相關圖片文件自動加密軟件一些重要的文件放在文件夾里,放在電腦的一角,不僅不方便自己使用,而且有被他人誤操作的危險。最好的方法是加密文件夾,這樣您就可以安全地將它放在一個您...

  • 初學制作表格視頻教程,ppt制作入門教程

    初學制作表格視頻教程,ppt制作入門教程 相關圖片初學電腦制作表格教程一。在創建任何動畫之前,你應該先有一個大致的輪廓,并知道你想做什么2繪畫是最基本的技能。一幅糟糕的畫基本上不能產生好的動畫。用別人的東西做動畫永...

  • jpg轉化pdf格式,怎么把pdf文件轉換成jpj

    jpg轉化pdf格式,怎么把pdf文件轉換成jpj 相關圖片pdf怎么弄成jpg格式我相信你已經遇到了將PDF文檔轉換成其他格式以便在日常工作和生活中瀏覽的情況。那么如何將PDF文檔轉換成JPG呢?如何將PDF文檔轉換為word?現在,超人軟件pdf怎么轉...

  • 文件夾選項沒有文件類型,文件夾選項里面沒有文件類型

    文件夾選項沒有文件類型,文件夾選項里面沒有文件類型 相關圖片文件類型文件夾選項中有許多關于文件夾和文件的擴展信息和功能,而有的小伙伴找到文件夾選項后,想找文件類型卻找不到了。那么文件夾選項在哪里?文件夾選項沒有文件類型怎么解...

  • 書簽圖片大全簡單漂亮,小制作大全簡單又漂亮

    書簽圖片大全簡單漂亮,小制作大全簡單又漂亮 相關圖片簡單又漂亮編者按:我的朋友讓你幫忙做一個標志?拜托,這件藝術品對設計師來說絕對是個好消息!制作一個標志只需要三個步驟。打開網站,輸入品牌名稱,選擇你喜歡的形象,一...

  • 網絡連不上怎么辦,為什么網絡連接不上

    網絡連不上怎么辦,為什么網絡連接不上 相關圖片網絡連接不可用Love clip是一款實用而強大的視頻剪輯工具,在中國擁有大量用戶。除了基本的視頻剪輯外,love clip還有很多強大的功能,有些功能需要聯網才能實現。但有waifai連接上沒...

  • 指南框架,指南的基本框架

    指南框架,指南的基本框架 相關圖片jacascript框架權威指南Philip Walton是appfolio的前端工程師。他在Santa Barbara on rails的聚會上提出了CSS體系結構和一些最佳實踐,并在他的工3到6歲指南的基本框架...

  • 派派聊天圖片保存在哪里,派派的照片在什么文件

    派派聊天圖片保存在哪里,派派的照片在什么文件 相關圖片卸載派派的圖片說說拍拍作為一種社交軟件,很多小伙伴都會上傳自己的照片,讓別人更快地了解自己。但是,當我不想使用它時,我不知道如何刪除我的照片。現在,超人軟件編輯也...

  • cellpadding,cellpadding默認值

    cellpadding,cellpadding默認值 相關圖片html cellspacing單元格--單元格填充--表示單元格外部的距離,用于將單元格與單元格空間分隔單元格間距--表示表邊框與單元格填充之間的距離,cellspacing什么意思...

  • 好用的文件夾加密軟件,怎樣把文件夾加密

    好用的文件夾加密軟件,怎樣把文件夾加密 相關圖片文件夾加密app文件夾使我們凌亂的電腦界面井然有序。某些同構文件將安裝在文件夾中。但是每個人都有隱私,因為隱私屬性收集的文件如果暴露在人們的眼睛下,就太混亂了。此時,...

熱評文章

  • 怎么查看別人共享的文件,如何加入共享文件夾

    怎么查看別人共享的文件,如何加入共享文件夾 相關圖片很裝b那種cmd命令為了方便文件傳輸,特別是在同一局域網內進行大范圍的文件傳輸,將要傳輸的文件放入共享文件夾中,這無疑要高于U盤和網絡盤的效率。如何設置共享文件夾?兩臺電...

  • 汽車配置參數詳解,汽車各種參數詳解

    汽車配置參數詳解,汽車各種參數詳解 相關圖片傳祺gs4配置參數詳解在Dreamweaver中插入flash后,可以有許多控制參數。單擊屬性面板右下角的“參數”按鈕以添加參數和值。您可以自由控制、參數和屬性以下標記屬性和參數描述傳祺...

  • 摩拜單車掃碼開不了鎖,摩拜單車掃出來了開不了鎖

    摩拜單車掃碼開不了鎖,摩拜單車掃出來了開不了鎖 相關圖片摩拜單車開不了鎖今天,很多摩比單車的用戶和朋友反映,他們在掃描和解鎖時發現自己正忙著服務或亂碼。如果摩比自行車不能解鎖呢?現在,超人軟件編輯想介紹一下,在iPhone上M...

  • 炫彩字效果怎么做,給圖片做炫彩效果

    炫彩字效果怎么做,給圖片做炫彩效果 相關圖片ps炫彩效果通常在圖像處理中,有時會特別追求折舊或劣質效果。當你拿起一張印刷粗糙的街頭小報時,劣質的墨水會弄臟紙張,原本通過網點印刷出來的照片在網頁制作中會更加顆粒狀...

  • 迅捷PDF轉換器,迅捷pdf轉換器怎么用

    迅捷PDF轉換器,迅捷pdf轉換器怎么用 相關圖片迅捷視頻轉換器轉換失敗怎么辦作為一個功能強大的PDF轉換工具,很多小伙伴都喜歡用它來轉換文件,但是你知道快速的PDF轉換器可以將word轉換成TXT嗎?快速PDF轉換器可以轉換成JPEG格迅...

  • 慧連刷,惠刷

    慧連刷,惠刷 相關圖片黑龍江慧刷視頻條是一款非常實用的視頻直播軟件。但如果你想成為其中的主人,你需要提前給慧幣充電。如何刷徽幣?現在,超人軟件編輯就為大家介紹一下石壩回幣方面的充值方法...

  • href onclick,href onclick不調用

    href onclick,href onclick不調用 相關圖片a標簽onclick標簽主要用于實現頁面跳轉。它可以通過href的屬性或在onclick事件中實現。代碼如下:aonclick=window。地點。網址:'www.jb51。Neta標簽的href...

  • win10待機,win10自動關機

    win10待機,win10自動關機 相關圖片win10待機黑屏無法喚醒Windows的自動待機和自動睡眠功能非常實用。有時我們的電腦還在工作,但人們有事要做就得離開,所以設置自動待機和自動睡眠非常方便。但許多用戶反映,自從...

  • 酷狗音樂如何與電腦同步,手機酷狗音樂怎么同步

    酷狗音樂如何與電腦同步,手機酷狗音樂怎么同步 相關圖片酷狗音樂電腦歌單同步到手機很多孩子在聽酷狗音樂時會下載他們最喜歡的歌曲,但當他們再次打開酷狗音樂時,他們就不能播放本地音樂。那么如何同步酷狗音樂呢?現在,超人軟件...

  • 優化建議,工作優化建議

    優化建議,工作優化建議 相關圖片部門流程優化和建議CSS圖像優化是盡可能壓縮圖像的大小,加快頁面加載速度,對大型網站非常有用。別小看它。它可以大大提高網頁的加載速度。通常,使用的方法是CSS sprites C優化工...

關注微信

变脸官网查询