hi,認識一下:我叫前端設計,請不要叫我美工
想必大家也會遇到這種情況,要做一個項目,產品經理說產品原型圖已經畫好了,讓我們去找一下素材,調一下顏色,看一下像素,把這個原型圖整體裝飾美化一番,然后就把我們叫做美工。我很不喜歡這種稱呼也很反對這種看法,其實像我們這種前端設計師應該成為懂美術和用戶體驗的產品經理,即時是裝飾美化也要注入產品的靈魂和思想在里面。 其實設計師是在改善產品的表征,同時在把更多的產品信息傳遞給用戶,通過不同元素的排列布局把產品的核心價值傳遞給用戶。 設計師應該把自己和產品經理一樣當成需求方,而不是執行者。用設計的語言展示產品需求,使老板看起來更直觀,讓技術不用過多的看產品文檔就能明白。只有這樣,才能讓其他環節對你更加尊重,愿意傾聽你對產品的建議。 今天我們就來說說前端設計的那些事兒,為了這期主題討論我們還特別邀請了群內混跡設計多年的專業人士為我們指點迷津,感謝3群(217321695)的同學們鼎力相助。 什么是前端設計?我們在開始討論時就被拋出了這樣的問題,經過各位同學的表述我們大致了解了什么是前端設計。 設計就是呈現的過程,前端設計是通過色彩/構圖/等元素賦予頁面性格和特點,前端也是展現,通過色彩先抓住自己的目標人群,通過設計表現自己。 當然這僅僅是是web前端設計的一部分而已,這被成為-界面設計。WEB前端設計實際上是網頁制作 ,經過web1.0進入web2.0之后網站的前端由此發生了翻天覆地的變化,網頁不再只是承載單一的文字和圖片,它除了設計還要掌握開發技術,如:HTML、CSS和JavaScript等。 Web前端設計主要分為5個步驟: 1.看需求; 2.畫草圖; 3.設計界面; 4.前端代碼編寫; 5.兼容性調試。 當然事情并不絕對,除了必要的步驟之外還有一些細節需要去做,設計前與產品經理,視覺分析師,體驗師溝通。設計定稿后,就是和后臺程序員,測試工程師溝通,并反復調試。 扁平化與擬物化,作為設計師現在必然要知道的兩個詞,那么他們本身都有什么樣的優缺點呢? 1、? 什么扁平和擬物設計 扁平化設計(Flat design)完全屬于二次元,這個概念最核心的地方就是放棄一切裝飾效果,諸如陰影,透視,紋理,漸變等等能做出 3D 效果的元素一概不用。所有的元素的邊界都干凈利落,沒有任何羽化,漸變,或者陰影。 而擬物化正好相反, 擬物設計(Skeuomorph)正好相反,他需要加入各種元素的效果,通過不同的效果組合達到模擬要呈現物件外觀的目的,以使新的外觀讓人感覺熟悉和親切。 2、? 扁平化與擬物化的優缺點 扁平化設計單獨設計起來更容易,突出內容主題,減弱各種漸變、陰影、高光等視覺效果對用戶視線的干擾,讓用戶更加專注于內容本身,并且容易統一設計風格,調整設計方案更加方便。而現在手機平板電腦“橫行”的今天,扁平化設計更能支持手勢交互,而且它占用系統空間相對較少。 擬物化設計更適合初級人員了來做,這并不表示擬物化設計簡單,而正是因為它的復雜所以更適合初級人員來做,可以讓設計人員短時間內熟悉各種效果的實現,更好掌握色彩搭配等。并且擬物化設計認知和學習成本低,更能直接的表現出想表現的事物。 相對于它們的優點多多,它們的缺點確是一目了然。擬物化設計更傾向于視覺效果,功能實現很少。扁平化所能承載的信息量太少,會提高用戶的學習成本。 這個問題拋出來就被群友吐槽說:“如果不該規范,那要第二個問題干嘛?”。好吧就當主持人提了一個弱智問題吧… 前端設計當然應該規范,原因是: 1、為了信息加載更快。 2、有利于后期調適和修改 3、有利項目二次開發。 4、有利于項目交接。 那么前端設計應該如何規范呢? 1、最基本的就是代碼規范,整齊、簡潔的代碼規范更方便后期調試和修改,也方便重用。 2、樣式素材歸類規范,養成好的素材歸類習慣,也是設計規范的一種。 一直以來產品的設計都是在討好用戶,或者說是讓用戶知道什么是適合他的設計,那么我們要從哪些角度讓用戶知道這些呢?總體來說大致可以分為兩種,一種是視覺上給予用戶滿足,另一種則是在流程引導上下功夫。 細致說來可以分為以下幾點: 1、? 符合產品特點的視覺呈現,并把自己代入用戶場景和角色設計布局(地鐵中右手使用手機等)。 2、? 突出的,利于使用的視覺交互體驗。 3、? 用戶對產品功能不清晰的情況下,通過視覺表現合理的引導整個使用的流程。 總結來說就是在視覺上引導和取悅用戶,在元素布局上讓用戶使用方便。 看到這里的時候各位看官請不要著急噴我,這一問題僅針對想要從設計轉行產品的各位同學,如果還是對前端設計很是熱愛的同學可以自動忽視,造成不便盡請諒解。 言盡于此,歸入正題。 要想轉行首先設計師應該把自己和產品經理一樣當成需求方,而不是執行者。這點至關重要,設計人員和產品經理最大的不同是思維,因為在做事的時候角色不同,思維模式必然不同,也就是之前說到的需求方和執行者,一個是被動接收信息,一個是主動推送(或者說發起)信息。只有從根本上轉變了思維才能開始這場蛻變、 設計師轉為產品還是有其優勢的,畢竟用設計的語言展示產品需求,使老板看起來更直觀,讓技術不用過多的看產品文檔就能明白。因為前端更多的時間用在頁面設計上,對布局這類了解更深,對用戶體驗要強與在職的部分產品經理。 而短板也很明顯,設計師更多在意的是界面方面,而產品跟多的要分析業務流程、商業化、功能邏輯這些。工作是分工很明確,但是轉職的時候欠缺的地方也是很明確的,如何轉?答案就在欠缺的那一部分。 在不拋棄自己優勢的情況下,由表現形式逆推理至業務邏輯,這是我對設計轉產品的同學們的一點建議。 特別鳴謝,提綱提供者:唐-PT-成都、小驢-交互-杭州兩位同學的精心撰寫,以及唐-PT-成都的討論主持。 另,標注: 此文檔為人人都是產品經理社區3群討論總結,由喵了咪編輯整理,轉載請注明原文鏈接。 感謝各位童鞋參加討論(排名不分先后): 師妹-學習-杭州、鑫-設計師-北京、喵了咪-PA-北京、唐-PT-成都、sharon-PM-北京、有關部門-PM-上海、李玄月-PM-杭州、博雅—PM-深圳、香水-UI-滬、兔子-PM-南京、暄顏-產品-杭州、咖啡-設計-上海、妖孽-學習-北京、絕跡-助理-貴陽、DT-PM-北京、騎狼d羊-PM-成都、小濕D-打雜-廈門、keiven-專員-廣州、夏陽-UI-深圳、米拉-產品-浙江、待業-pm-深圳、三點-PM-川都、Jesse-學生-上海、大肚熊-PM-常州、zumin-產品-北京、Thik-PM-深圳。一、什么是前端設計
二、扁平化設計vs擬物化
三、前端設計應不應該規范?如何規范?
四、設計師應該從什么角度去考慮用戶體驗?
五、前端設計如何成為產品經理?
主要還是感覺美工這個說法一下子給喊low了吧
我腫么感覺是在說UI呢。。。
nn
真心覺得3群特別棒!從來沒加過這樣一個棒的群,討論周周進行,學習從未停止。這種精神就值得大贊特贊!