92国产精品视频_亚洲a级在线观看_国产精品电影观看_国产精品免费观看在线_精品伊人久久97_亚洲人成在线观_尤物九九久久国产精品的特点_成人激情在线播放_成人黄色大片在线免费观看_亚洲成人精品久久久_久久免费视频在线观看_久久精品国产一区_国产一区二区三区18_亚洲欧美中文字幕在线一区_日韩美女中文字幕_日韩视频免费在线

首頁

5個技巧,讓你的做圖效率翻10倍!

seo達人



相信很多設計師都會覺得每天時間不夠用,沒有效率,沒有收獲,那么今天分享5個時間管理的方法,幫助你提升效率的同時,個人也能得到成長。請看今天的分享,enjoy it。

 

如何做好時間管理?

圖片

網上流傳一張王健林的行程單,可以看得出時間分配相當滿,于是我就特別好奇,專門問了一些我們公司的高P,他們每天那么多工作,是如何去平衡生活和工作的,其中有一個很重要的點就是做好時間管理且自律。

比如今天晚上8點要和孩子去看一個音樂會,就會在8點之前把所有的工作全部搞定,然后去陪孩子!是呀,厲害的人,能在某一個點把事情全部搞定,本身就是超強的能力,那么作為職場人,我們該怎么合理管理時間呢,今天分享6個小方法給大家。

 

方法一:番茄工作法 

番茄工作法是由弗朗西斯科·西里洛于1992年創立的一種相對于GTD更微觀的時間管理方法。因為創始人使用番茄定時器,所以叫番茄工作法。

圖片

 

如何使用?

選擇一個待完成的任務,將番茄時間設為25分鐘,專注工作,中途不允許做任何與該任務無關的事,直到番茄時鐘響起,然后在短暫休息一會(5分鐘就行),每4個番茄時段多休息一會兒。

這個方法為什么好用呢?我相信很多設計師和我一樣,每次工作幾分鐘后就會玩玩手機,看看微信,一邊聽歌,刷著網站,同時做著幾件事情。

這個就是明顯的一心多用,不夠聚焦,番茄時鐘好處就是督促你在這個25分鐘內,專心只做一件事情。充分利用大腦的集中注意力去高效完成一件事,然后休息5分鐘,再開始下一個番茄時間。

圖片

當然你也可以根據你個人習慣來調整時間,我將番茄時間的25分鐘改成了45分鐘,這樣有助于我更好的聚焦。比如我有一個需求時,我會花45分鐘看完交互流程,45分鐘去和開發還原開發細節,45分鐘去收集設計靈感,45分鐘去把頁面框架搭建好,或者設計好一個局部等等,然后休息5分鐘,讓自己短暫休息下。

圖片

 

合理拆解需求

學會拆解任務,設計師的需求有大有小,大的比如一個首頁改版,一個設計語言的建立,小的有一個彈窗設計,一個圖標繪制等等,那么運用番茄時間的第一步就是你需要對工作任務進行合理的拆解,才能用多個番茄時間段來覆蓋整個項目,比如需要做一個首頁改版,那么我就需要進行拆解任務。

圖片

首頁改版可以分成四個大的關鍵節點,需求討論,設計風格探索,視覺設計,交付開發,然后每個大的模塊下再細分小的任務,然后進行番茄時鐘的評估,比如色彩收集我可能需要2個45分鐘,那么就2個番茄時鐘去完成它。

所以我們要學會合理的去拆分你的需求任務!明確到可執行的番茄時鐘。

 

及時提醒

圖片

每個25分鐘或者45分鐘的時間點提醒一定要及時,鬧鐘響了,停下手上工作,短暫的休息調整下,切忌繼續一直工作下去,因為只有適當休息,我們才能更加高效,高質量的完成接下來任務。

 

聽聽白噪音

圖片

很多同學在工作時,喜歡戴著耳機聽著音樂,但是在使用番茄時鐘時,我不太建議這樣做,原因在于音樂會干擾我們思考,有時候音樂還會影響你的情緒,所以這個時候建議大家聽聽舒緩的白噪音,比如海浪聲音、風聲、雨聲,我個人比較喜歡聽海浪拍打的聲音,能夠讓自己靜下心來。

這里推薦一個番茄時鐘的MAC工具,叫番茄鐘,里面除了設置番茄鐘外,還自帶很多白噪音,非常好用!

圖片

 

方法二:四象限時間法 

美國的管理學家科維提出的一個時間管理的理論,把工作按照重要和緊急兩個不同的程度進行了劃分,基本上可以分為四個“象限”:

1.既緊急又重要:

如同事投訴、即將到期的任務、上線危機等

2.重要但不緊急:

建立人際關系、設計培訓、制定設計規范等

3.緊急但不重要:

如取快遞、部門會議等

4.既不緊急也不重要:

如網購、閑談、郵件、發朋友圈等

我們需要把每天工作任務,按處理順序劃分:先是既緊急又重要的,接著是重要但不緊急的,再到緊急但不重要的,最后才是既不緊急也不重要的。我們具體來看看設計工作中的一些場景。

圖片

 

既緊急又重要

設計師工作場景:比如項目上線前的設計更改,明天和主管匯報的PPT,需求設計評審,這是我們每天工作的核心,大多數設計師在公司中日常任務就是產品的迭代,那么重要的事都是不能一拖再拖,都是迫在眉睫。

因為整個產品是趕時間點的,比如雙11那天必須上線,那么無論如何都要按時保質量的完成,所以這時候是考驗我們經驗、判斷力的時刻,如果沒有做好,很有可能影響你的考核和晉升。

我自己的方法是每晚睡前給自己列出明天最重要的必須完成的3件事情,并用工具軟件記錄下來!

圖片

 

重要但不緊急

這里主要是和你個人成長發展有關,比如學習英語、提升動效技能、掌握C4D、理財等等,這些很重要,但是很多時候我們每天都在處理重要又緊急的事情,特別是互聯網公司,每天都在做需求,對于自己的個人規劃,根本沒有時間處理,就會導致你個人的提升這些事情完全沒有時間做,多把精力放在這個領域去提升自己,必須主動去做,這是對于你個人成長最有幫助的。

比如你未來3年希望去大廠工作,那么你就要列出來大廠設計師的技能有哪些,比如科學設計方法、設計思維、動效、數據能力,然后都放在你重要不緊急事情里。在精力有限的基礎上多做投入和提升,慢慢才能達到目標,否則就一直成為流水線設計,或者項目里面一個資源方,個人成長永遠沒有!

圖片

 

緊急但不重要

比如PM找你聊需求,當然正常需求該聊還是聊,但是工作中經常有的聊,真的只是陪聊,很多時候真的在沒有必要,沒有結果的開會,聊需求真的是浪費時間,表面看似第一象限緊急事情里,因為迫切的呼聲會讓我們產生“這件事很重要”的錯覺——實際上就算重要也是對別人而言。我們花很多時間在這個里面打轉,其實不過是在滿足別人的期望與標準。

設計師經常遇見的,改文案啊,產品會議,開發排期這種會議在我看來,出來關鍵節點有結果的需要參加,更多事情能少參與就少參與。

圖片

 

既不緊急也不重要

這里的既不緊急也不重要就是每天你花費時間最多的地方,比如群里聊天,刷朋友圈,抖音,看八卦新聞,當然人都是需要一些無聊消遣的,但不值得花很多時間在這個象限。剛開始時也許有滋有味,到后來你就會發現其實是很空虛的。

我經常給大家說,你怎么比別人進步更快,就是設計之外的8小時你在做什么。別人工作時間外8小時都在學設計,學各種課程,而你在做些無聊事情,一年下去差別就出來了,不是說我們不應該去娛樂,而是需要注意時間分配。

總之,關于時間的4象限,需要大家多多的關注,多把精力放在重要又緊急,然后允許情況下,多提升重要不緊急事情的投入,長期堅持下去,你會有巨大的改變。

 

方法三:先思考再動手 

圖片

在接到需求時候,多問自己幾個為什么,這個頁面為什么要改版?改版是為了提升用戶留存,還是活躍度?還是提升頁面轉化?還是優化了什么?了解清楚,梳理清楚邏輯、流程關系以后再動手,這才是一個正確的做事方式,同時也需要思考,你在這中間做了哪些有價值的事!

這個道理很簡單,但是很多人都沒有做到,我也有很多時候,做著做著掉進一個坑里,所以做之前想清楚,想好了再做會更好!

 

方法四:避免重復造輪子 

圖片

 

避免重復,經常總結積累

做一件事情,學會舉一反三,學會從點到面,在很多公司面試晉升過程中,比如阿里,P6資深設計師和P7專家設計師,很重要的一個技能點就是,如何從點做到面。

我們在做很多需求時候,需要思考,這次做的這個需求后續如果遇見類似的,能不能快速解決,而不至于浪費時間和精力投入進去沒有成長!比如說按鈕設計,我們隨便抓一個市場上的按鈕,你會發現按鈕的樣式、大小顏色就是各種不統一,浪費開發資源和設計資源!如果你每天的工作都是做這種浪費精力沒有存在感的事情,對于個人是很不利的,平時做項目多留心下,比如我做一個專題頁面是不是可以去思考下,這個頁面做完哪些控件我可以沉淀下來,復用到其他的場景中,賦能給其他設計師呢,這個是很重要的!

同樣的,比如我們最近在研究一個彈窗,那么是不是我做這次彈窗,我就把彈窗徹底研究透徹,彈窗尺寸大小、顏色、按鈕、狀態都研究徹底,徹底掌握了這個知識點,后面再做彈窗信手拈來,深刻搞定一個任務,避免反復,經常總結和積累,也是提升效率很重要的方法。

圖片

 

當你覺得很難的時候其實是在上坡

這是我很有感觸的一句話,人的成長體現在同樣的事情上,萬事開頭難,但后面會越來越順手,因為在這個過程中你已經掌握了方法,我們需要做的就是不要半途而廢,要學就學透學完整,后面工作效率就上來了。

圖片

我們的專業知識就像這4個空杯子,一個代表AE,一個是C4D,一個是UI,一個是插畫,很多東西都想掌握,于是每天學習一次就往這個杯子澆水一點,但是堅持10天就堅持不下去了,要么學別的,要么沒有動力了,然后導致最后什么都沒學到。

圖片

正確做法是把一件事情學透了,學徹底了再去學下一件事情,你學AE就徹底把AE掌握了,再去學下一個,這樣避免反復,徹底掌握不僅能加速你的成長,更能讓你專業更深!

 

方法五:放下手機,定時間點 

最后這個方法對我來說很有效,學會放下手機,放下干擾,中國口香糖的營業額持續下降,大家知道為什么嗎?口香糖一般都會擺在收銀臺的旁邊,因為用戶在超市收銀臺排隊的時候,都在玩手機,沒有人去看前面的貨臺!可見手機對我們影響有多大,所以當你準備學習時候,或者去完成一個任務時候,最有效就是手機放起來,至少一個番茄時間不要去看,這樣保證你的效率變高。

另外一個方法就是定時間點,定結束時間點很重要,人對于時間點都是有天然遵守的,比如地鐵錯過末班車就回不了家,火車飛機晚點你也回不去,所以我們做事情時候可以立一個最晚完成時間,然后去做,比如我寫作,定的時間就是每周末必須寫完,所以我周末再忙,都會去抽空寫完。

 

最后 

今天分享的這些經驗,都是我實踐過并有效的方法,希望可以幫助到大家一同實踐起來,照著做下去,你會發現能壓縮至少1/3的時間出來,讓我們都把時間花在正確的事情,和正確的人身上,快樂工作,快樂成長,快樂生活!

 

原文地址:我們的設計日記(公眾號)
作者:sky

轉載請注明:學UI網》5個技巧,讓你的做圖效率翻10倍!

藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷   作者:陳皮Celia 

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務


沒想到過程稿這么丑,結果用了兩招就把效果改好了!

seo達人



上次我們分享了左面的等級相關的,今天我們接著來分享第二張任務相關的。本文會從引導頁的3個方面講解:一個好的創意非常重要、元素一定要有細節、搞一些靈動的小亮點,做好這3點能給作品加不少分。

最近做的引導頁,效果如下:

圖片

 

1.一個好的創意非常重要

很多時候,一個好的創意非常關鍵,可以讓設計產生亮點,等級這個頁面,我個人還蠻喜歡這個創意的。

因為這個頁面講的是每周任務,我從“周”這個字眼想到了時間又想到了日歷,所以我想用一個大的日歷作為整體外輪廓,然后日歷里面的結構是一些相關的禮物元素。

但是最開始的效果并不理想:

圖片

看不太出來是日歷,那怎么樣才能一眼就看出來是日歷呢?

那就是有一種翻頁的感覺,比如下面這種:

圖片

這樣就可以看出來是日歷了。

除了日歷,剛才也說了,還要有一些相關元素,禮物呀、升級的火箭呀、直播的小電視呀等等:

圖片

這樣有大的框架,再加上修飾的元素,整體的創意就差不多了。

 

2.元素一定要有細節

每一個元素都會影響畫面精致度,比如之前說的那個禮盒,之前沒倒角,倒角之后,和整個更搭一些:

圖片

再比如,我之前畫的電視有點太簡單粗暴了:

圖片

于是找了幾個電視的參考:

圖片

加了一些細節和優化,優化后效果如下:

圖片

這樣就比之前精致一些。

當每一個單體做到位了,組合起來就不會差太多,否則就會影響整體質量。

 

3.搞一些靈動的小亮點

其實讓畫面變靈動的方法有很多種,我個人特別喜歡使用一些可愛的表情、或者小形象。

比如之前在做任務頭圖的時候,字體上加了一個小微笑的表情:

圖片

再比如這次,在日歷外面加了一個黑子,偷偷看里面禮物的細節:

圖片

讓用戶感覺里面確實有很多好東西。

再比如日歷里面的星星也加入了表情:

圖片

讓其更加有生命力。

這些都是我喜歡使用的小技巧。

 

總結

今天就先分享這么多啦,每次做引導頁都是比較開心的,因為可發揮空間會比較大一點,也可以使用自己比較喜歡的3D手法,希望過程中的小感悟可以給大家來點靈感!

下期見,么么扔!

 

原文地址:菜心設計鋪(公眾號)
作者:菜心設計鋪

轉載請注明:學UI網》沒想到過程稿這么丑,結果用了兩招就把效果改好了!

藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷   作者:陳皮Celia 

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務


情感化層面解讀微信“拍一拍”的價值

seo達人



2020年6月17日,微信發布了新版本,上線了“拍一拍”功能。從上線之初火遍每個社群,到現在迅速沉寂下來,這種變化應該也在很多人的意料之中。那“拍一拍”的價值點到底在哪里呢?我也來給大家說道說道。

文章的主要內容包括:
01、“拍一拍”功能定位
02、功能拆解
03、體驗設計分析
04、“拍一拍”價值分析

 

01功能定位

張小龍朋友圈:“微信史上僅需一行代碼的有趣功能終于來了。拍一拍,像螞蟻一樣打招呼?!?/section>
圖片
從張小龍的描述中,拍一拍功能定位是一種打招呼方式,而且希望帶給用戶更加有趣的體驗。

 

02功能拆解

社交本質上是人與人之間的信息傳遞,這其中包括兩大節點,信息的輸出和接收。所以我們就從這兩個維度去分析下“拍一拍”功能。

 

1-信息輸出
操作方式:用戶只要雙擊對方的頭像就可以完成拍一拍行為。

 

操作反饋:
1)對方頭像晃動,伴隨著手機震動,同時聊天界面中會出現提示文案,“你拍了拍xx”。

 

2)如果對方不再是用戶好友時,“拍一拍”在顯示文案信息基礎上,還增加了朋友驗證的提示信息。
圖片

 

3)當用戶退出對話框時,拍一拍的對話欄會根據信息時間重新排序,類似于消息排序的邏輯。
圖片

 

2-信息接收
信息接收主要包括以下3個場景:聊天列表、對話框、信息刷屏狀態。

 

1)聊天列表

當別人拍了拍我們,或者別人拍了拍別人,我們都不會收到任何提醒。為了讓用戶有所感知,同樣會根據更新時間順序將對話欄顯示在聊天列表中,同時列表會展示拍一拍文案信息。

圖片

 

2)對話框
當用戶打開對話框時,頭像會晃動兩下,并伴隨著手機震動。讓用戶明顯地感知拍一拍信息。

 

3)歷史消息
當聊天界面內容較多,“拍一拍”的信息被刷屏了,那該怎么辦呢?
不用擔心,微信考慮的很周全,當用戶上翻聊天信息時,內容顯示到“拍一拍”文案時,手機也會發出震動反饋,保證用戶無需仔細閱讀信息內容,即可快速、準確地感知到“拍一拍”信息。
此外在用戶行為方面,“拍一拍”玩法沒有做出限制,用戶可以自拍,別人互拍及自拍,并且文案信息都會呈現在對話框中。最大限度的激發用戶互拍的欲望。

 

03體驗分析

1)簡單
微信作為重要的社交工具,一直在孜孜不倦的追求簡單的玩法。所以“拍一拍“操作簡單,只需要雙擊用戶頭像即可實現,這也是能夠掀起全民互拍狂歡的基礎條件。

 

2)輕量
拍一拍作為弱提醒方式,其實是對現有信息提醒方式的補充,強調點到為止。盡可能減少社交信息給用戶帶來的心理壓力。

 

3)感知
為了激活用戶交流,需要保證用戶對信息的感知。因此在對話欄排序上參照文字消息的邏輯。而打開對話框時、微信群消息等場景中增加了震動反饋。

 

4)有趣
“拍一拍”豐富了微信的溝通方式,在文字、圖片、語音等信息形式基礎上,增加了現實生活中的行為方式,形成了更強的行為映射。所以引發了一波“拍一拍”浪潮,也被廣大網友玩出了新的高度。
圖片
(圖片來源于網絡)

 

04價值分析

1-用戶側價值
張小龍說,“微信的夢想是什么?從個人角度成為人最好的一個工具朋友。從平臺角度,建立一個市場,讓創造者體現價值。”
那請允許我推測一下“拍一拍”對用戶的價值。

 

1)新的社交禮儀
現在的微信消息提醒方式包括對話欄角標、群內@,強提醒等形式,這些形式都讓用戶都無法忽視。特別是一對一溝通時,紅色的角標如果一直存在,可能會逼死強迫癥患者。但是一旦打開消息界面,你又無法忽略信息的內容。因此之前就有人提出增加一個信息置底功能。
而“拍一拍”作為一種輕量級的打招呼方式,或許可以成為微信社交中新的選擇。例如在微信群中,如需非緊急必要的事情,可以在信息之后,拍一拍對方,表示這條信息是專門發給他的,讓他能夠接收到就可以了。而不需
要采用@的方式,減少對用戶帶來的信息轟炸和心理壓力。

 

2)快速回復
未來“拍一拍”可能會成為一種快速回復方式。
當前交互方式中,文本信息方式用戶成本最高;圖片、表情方式可能無法準確的表達回復內容;語音、通話過于沉重,對環境要求也較高。因此微信需要創造一種更加快捷的方式滿足簡單回復的需求。
而拍一拍,可以輕松的實現這一點,拍一拍對方即可表示消息反饋,又減少了用戶交互成本。

 

3)情感化表達
現實生活中,拍一拍包含了各種情感信息。
例如當我們需要與別人打招呼或者溝通時,可以通過“拍一拍”、“戳一戳”等接觸方式,引起別人更強烈的注意。
又比如當我們跟別人溝通結束時,可以拍一拍對方,給予鼓勵?;蛘哒f一句“沒事的,以后肯定會更好“、順手拍一下對方,表示理解或感同身受。
同樣作為現實生活的映射,在微信聊天過程中,我們可以借用“拍一拍”,更加充分的表達情緒,而震動反饋或許能夠讓對方更加真切的感受到我們的關愛。

 

2-產品側價值
1)促進版本升級
“拍一拍”需要升級微信版本才能使用,當全民都在拍一拍時,你是無法視而不見的。因此可以更好的促使用戶主動升級版本。

 

2)激活微信群
“拍一拍”上線后,很多沉寂已久的微信群開始“復活”了。大家都在主動的嘗試新的功能,而且網友們還玩出了各種花樣。而這僅僅只需一行代碼的投入就做到了,可以說價值巨大。
 

總結

我們都知道,微信是極具克制理念的產品,微信每天都拒絕著大量的看似合理的用戶需求,張小龍有著自己的設計理念。此次“拍一拍”功能對用戶的行為也做到最輕量級的影響。
或許“拍一拍”只是一次新的嘗試,最終會隨著新鮮感的喪失,成為用戶眼中的“雞肋”功能。但是這其中帶給我們的啟示,是值得我們深入思考的。

 

原文地址:子牧UXD(公眾號)
作者:子牧先生

轉載請注明:學UI網》情感化層面解讀微信“拍一拍”的價值

藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷   作者:陳皮Celia 

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務


設計師的項目管理意識

seo達人


項目協同與執行的過程中總感覺節奏亂?對于項目缺乏整體的規劃、每次設計過程中付出的成本很高。對結果驗證時發現不論設計質量還是效率都還有很大的提升空間。設計感覺做的不錯,但項目中的角色話語權不高?多個項目并行不知如何管理操作,有無標準方法,怎么從中創造更大的價值?本文結合日常項目管理當中的一些思考與方法,帶大家了解設計師需要有的項目管理意識。

 

如今設計師不再僅僅作為一個需求的接收方與執行方,職能更加的全面,在整個產品設計研發流程中也需要我們有更強的參與度。最近工作中得到一些設計同學的咨詢并參與圍繞著一些項目中的問題進行討論,比如:項目協同與執行的過程中總感覺節奏亂?對于項目缺乏整體的規劃、每次設計過程中付出的成本很高。對結果驗證時發現不論設計質量還是效率都還有很大的提升空間。設計感覺做的不錯,但項目中的角色話語權不高?多個項目并行不知如何管理操作,有無標準方法,怎么從中創造更大的價值?本文結合日常項目管理當中的一些思考與方法,帶大家了解設計師需要有的項目管理意識。

圖片

a

01.好的設計能不能管理出來?能收獲什么?

首先,我們思考一下,管理是什么?其實簡單來說更像是很多標準化、流程化、格式化的方式方法組合,輔助我們更好的達成目標,并為整個設計團隊構建一個基礎的工作體系。項目中穩定與高效輸出都來自于更加科學的管理。設計師鏈接上下游部門,也需要通過管理來解決諸多設計以外但與設計有聯系的事務。對于我們的收獲部分可以大致分成以下三點:

圖片

· 目標達成層面

引導促成整個產品/項目的目標高質高效達成,使之利益最大化。

· 視角變化層面

能夠讓我們視角產生改變,能夠更全局看待問題,讓自己有大局觀的同時更加擁有結構化的思維。

· 影響力與服務能力的提升層面

在項目中角色話語權提升,在團隊內外有更高的影響力

a

02.項目管理我要管什么?

設計師運用項目管理的方法,個人認為最基本的就是要合理的規劃與控制,管人管事,且貫穿在整個項目流程當中,以下幾點其實我們可以重點關注。

圖片

我們工作當中實際參與的流程,基本可以歸納為啟動階段、計劃階段、執行監控階段、收尾階段。

 

· 啟動階段

在這個階段經常會使用到6W2H方法,它有助于我們思路的條理化,杜絕盲目性,所以此方法能夠快速幫助我們確定目標、里程碑、項目成員以及合作模式,例如在此前的二手車大類頁改版等大型改版項目中都有所使用。

圖片

 

· 規劃階段

需求的梳理、排期、以及任務拆分、資源協調。我們可以嘗試使用STAR模型來操作。而這部分在車業務的內部設計需求中也是在iWiki常態化留檔的,以SITUATION(背景),TASK(任務),ACTION(行動),RESULT(結果)幾個維度構成表的基本結構。

圖片
圖片

需求規劃完畢需要考慮的就是內部資源協調,在專職項目、動態項目、創新項目中協調的原則上可以是:擅長人做擅長事,挑戰與執行并存,提效最大化,成長最大化。

 

· 執行監控階段

在此階段,我們可能會遇到以下一些問題,產出效率不高、質量不高、反復修改或項目推進緩慢影響業務目標。這些情況或風險在很多項目當中都存在,風險并不一定是壞事,而風險大多數都是可以預測和管理的,我們可以多使用WWH模型和STAR模型結合的方式快速的輔助我們思考、記錄、評估、計劃、調整。在落實的時候我們會使用到iWork工具進行需求的變更、說明、同步,包括后續的進度跟蹤與回溯,在項目的管理上非常直觀易用。

圖片

圖片

 

· 收尾階段

對于該階段質量控制方面,我們引入了更規范的走查文檔、共建集成體驗環節、以及全職能自查環節。常規的設計走查介入方式如下:

圖片

改變走查方式之后,增加集成體驗環節與每個節點中的輸入輸出內容,保障每次項目的最終落地質量。

圖片

在收尾階段從項目管理的角度來說另外一個希望提及的是,除了事前有規劃、執行有控制、更要注重事后收尾有總結。雖然每一次的項目可能過程會有一些不同、結果目標不同,但是我們在總結復盤的過程中一定要做到以下幾點:

1.拒絕形式化,避免假大空反思

2.具備借鑒意義

4.對應解決方案,具體落實到人、功能范圍、時間等

w

03.聊聊其它

其實我們可以發現既然是要去管理項目,在每個節點里溝通是非常重要的,可能很多設計師都會遇到一些溝通方面的問題:效率低、無結果、懼怕溝通。其實多數就是在信息通過傳輸渠道、媒介的時候,發送者與接受者在各階段所暴露出的不同問題,如下圖:

圖片

 

· 我們可以怎么做呢?大家可以多從以下幾點去思考

1.溝通前的思路整理以及相關案例或設計理論的支持

2.對齊溝通方的關注點與信息交集

3.靈活正確的處理意見與分歧,開放心態、開放式話術、氣氛控制、善用詢問等

4.總結與使用流程管理進行規劃

5.建立設計師個人品牌可信度

以上為對日常設計項目管理工作的一些個人理解,大家可在實際的項目當中靈活應用,如對項目管理方面非常感興趣的同學也可以去看看PMP相關知識,也歡迎入群多多交流。

圖片

 

原文地址:58UXD(公眾號)

作者:環鐵藝術家

轉載請注明:學UI網》設計師的項目管理意識

藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷   作者:陳皮Celia 

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務


5個技巧,讓你的做圖效率翻10倍!

seo達人



相信很多設計師都會覺得每天時間不夠用,沒有效率,沒有收獲,那么今天分享5個時間管理的方法,幫助你提升效率的同時,個人也能得到成長。請看今天的分享,enjoy it。

 

如何做好時間管理?

圖片

網上流傳一張王健林的行程單,可以看得出時間分配相當滿,于是我就特別好奇,專門問了一些我們公司的高P,他們每天那么多工作,是如何去平衡生活和工作的,其中有一個很重要的點就是做好時間管理且自律。

比如今天晚上8點要和孩子去看一個音樂會,就會在8點之前把所有的工作全部搞定,然后去陪孩子!是呀,厲害的人,能在某一個點把事情全部搞定,本身就是超強的能力,那么作為職場人,我們該怎么合理管理時間呢,今天分享6個小方法給大家。

 

方法一:番茄工作法 

番茄工作法是由弗朗西斯科·西里洛于1992年創立的一種相對于GTD更微觀的時間管理方法。因為創始人使用番茄定時器,所以叫番茄工作法。

圖片

 

如何使用?

選擇一個待完成的任務,將番茄時間設為25分鐘,專注工作,中途不允許做任何與該任務無關的事,直到番茄時鐘響起,然后在短暫休息一會(5分鐘就行),每4個番茄時段多休息一會兒。

這個方法為什么好用呢?我相信很多設計師和我一樣,每次工作幾分鐘后就會玩玩手機,看看微信,一邊聽歌,刷著網站,同時做著幾件事情。

這個就是明顯的一心多用,不夠聚焦,番茄時鐘好處就是督促你在這個25分鐘內,專心只做一件事情。充分利用大腦的集中注意力去高效完成一件事,然后休息5分鐘,再開始下一個番茄時間。

圖片

當然你也可以根據你個人習慣來調整時間,我將番茄時間的25分鐘改成了45分鐘,這樣有助于我更好的聚焦。比如我有一個需求時,我會花45分鐘看完交互流程,45分鐘去和開發還原開發細節,45分鐘去收集設計靈感,45分鐘去把頁面框架搭建好,或者設計好一個局部等等,然后休息5分鐘,讓自己短暫休息下。

圖片

 

合理拆解需求

學會拆解任務,設計師的需求有大有小,大的比如一個首頁改版,一個設計語言的建立,小的有一個彈窗設計,一個圖標繪制等等,那么運用番茄時間的第一步就是你需要對工作任務進行合理的拆解,才能用多個番茄時間段來覆蓋整個項目,比如需要做一個首頁改版,那么我就需要進行拆解任務。

圖片

首頁改版可以分成四個大的關鍵節點,需求討論,設計風格探索,視覺設計,交付開發,然后每個大的模塊下再細分小的任務,然后進行番茄時鐘的評估,比如色彩收集我可能需要2個45分鐘,那么就2個番茄時鐘去完成它。

所以我們要學會合理的去拆分你的需求任務!明確到可執行的番茄時鐘。

 

及時提醒

圖片

每個25分鐘或者45分鐘的時間點提醒一定要及時,鬧鐘響了,停下手上工作,短暫的休息調整下,切忌繼續一直工作下去,因為只有適當休息,我們才能更加高效,高質量的完成接下來任務。

 

聽聽白噪音

圖片

很多同學在工作時,喜歡戴著耳機聽著音樂,但是在使用番茄時鐘時,我不太建議這樣做,原因在于音樂會干擾我們思考,有時候音樂還會影響你的情緒,所以這個時候建議大家聽聽舒緩的白噪音,比如海浪聲音、風聲、雨聲,我個人比較喜歡聽海浪拍打的聲音,能夠讓自己靜下心來。

這里推薦一個番茄時鐘的MAC工具,叫番茄鐘,里面除了設置番茄鐘外,還自帶很多白噪音,非常好用!

圖片

 

方法二:四象限時間法 

美國的管理學家科維提出的一個時間管理的理論,把工作按照重要和緊急兩個不同的程度進行了劃分,基本上可以分為四個“象限”:

1.既緊急又重要:

如同事投訴、即將到期的任務、上線危機等

2.重要但不緊急:

建立人際關系、設計培訓、制定設計規范等

3.緊急但不重要:

如取快遞、部門會議等

4.既不緊急也不重要:

如網購、閑談、郵件、發朋友圈等

我們需要把每天工作任務,按處理順序劃分:先是既緊急又重要的,接著是重要但不緊急的,再到緊急但不重要的,最后才是既不緊急也不重要的。我們具體來看看設計工作中的一些場景。

圖片

 

既緊急又重要

設計師工作場景:比如項目上線前的設計更改,明天和主管匯報的PPT,需求設計評審,這是我們每天工作的核心,大多數設計師在公司中日常任務就是產品的迭代,那么重要的事都是不能一拖再拖,都是迫在眉睫。

因為整個產品是趕時間點的,比如雙11那天必須上線,那么無論如何都要按時保質量的完成,所以這時候是考驗我們經驗、判斷力的時刻,如果沒有做好,很有可能影響你的考核和晉升。

我自己的方法是每晚睡前給自己列出明天最重要的必須完成的3件事情,并用工具軟件記錄下來!

圖片

 

重要但不緊急

這里主要是和你個人成長發展有關,比如學習英語、提升動效技能、掌握C4D、理財等等,這些很重要,但是很多時候我們每天都在處理重要又緊急的事情,特別是互聯網公司,每天都在做需求,對于自己的個人規劃,根本沒有時間處理,就會導致你個人的提升這些事情完全沒有時間做,多把精力放在這個領域去提升自己,必須主動去做,這是對于你個人成長最有幫助的。

比如你未來3年希望去大廠工作,那么你就要列出來大廠設計師的技能有哪些,比如科學設計方法、設計思維、動效、數據能力,然后都放在你重要不緊急事情里。在精力有限的基礎上多做投入和提升,慢慢才能達到目標,否則就一直成為流水線設計,或者項目里面一個資源方,個人成長永遠沒有!

圖片

 

緊急但不重要

比如PM找你聊需求,當然正常需求該聊還是聊,但是工作中經常有的聊,真的只是陪聊,很多時候真的在沒有必要,沒有結果的開會,聊需求真的是浪費時間,表面看似第一象限緊急事情里,因為迫切的呼聲會讓我們產生“這件事很重要”的錯覺——實際上就算重要也是對別人而言。我們花很多時間在這個里面打轉,其實不過是在滿足別人的期望與標準。

設計師經常遇見的,改文案啊,產品會議,開發排期這種會議在我看來,出來關鍵節點有結果的需要參加,更多事情能少參與就少參與。

圖片

 

既不緊急也不重要

這里的既不緊急也不重要就是每天你花費時間最多的地方,比如群里聊天,刷朋友圈,抖音,看八卦新聞,當然人都是需要一些無聊消遣的,但不值得花很多時間在這個象限。剛開始時也許有滋有味,到后來你就會發現其實是很空虛的。

我經常給大家說,你怎么比別人進步更快,就是設計之外的8小時你在做什么。別人工作時間外8小時都在學設計,學各種課程,而你在做些無聊事情,一年下去差別就出來了,不是說我們不應該去娛樂,而是需要注意時間分配。

總之,關于時間的4象限,需要大家多多的關注,多把精力放在重要又緊急,然后允許情況下,多提升重要不緊急事情的投入,長期堅持下去,你會有巨大的改變。

 

方法三:先思考再動手 

圖片

在接到需求時候,多問自己幾個為什么,這個頁面為什么要改版?改版是為了提升用戶留存,還是活躍度?還是提升頁面轉化?還是優化了什么?了解清楚,梳理清楚邏輯、流程關系以后再動手,這才是一個正確的做事方式,同時也需要思考,你在這中間做了哪些有價值的事!

這個道理很簡單,但是很多人都沒有做到,我也有很多時候,做著做著掉進一個坑里,所以做之前想清楚,想好了再做會更好!

 

方法四:避免重復造輪子 

圖片

 

避免重復,經??偨Y積累

做一件事情,學會舉一反三,學會從點到面,在很多公司面試晉升過程中,比如阿里,P6資深設計師和P7專家設計師,很重要的一個技能點就是,如何從點做到面。

我們在做很多需求時候,需要思考,這次做的這個需求后續如果遇見類似的,能不能快速解決,而不至于浪費時間和精力投入進去沒有成長!比如說按鈕設計,我們隨便抓一個市場上的按鈕,你會發現按鈕的樣式、大小顏色就是各種不統一,浪費開發資源和設計資源!如果你每天的工作都是做這種浪費精力沒有存在感的事情,對于個人是很不利的,平時做項目多留心下,比如我做一個專題頁面是不是可以去思考下,這個頁面做完哪些控件我可以沉淀下來,復用到其他的場景中,賦能給其他設計師呢,這個是很重要的!

同樣的,比如我們最近在研究一個彈窗,那么是不是我做這次彈窗,我就把彈窗徹底研究透徹,彈窗尺寸大小、顏色、按鈕、狀態都研究徹底,徹底掌握了這個知識點,后面再做彈窗信手拈來,深刻搞定一個任務,避免反復,經??偨Y和積累,也是提升效率很重要的方法。

圖片

 

當你覺得很難的時候其實是在上坡

這是我很有感觸的一句話,人的成長體現在同樣的事情上,萬事開頭難,但后面會越來越順手,因為在這個過程中你已經掌握了方法,我們需要做的就是不要半途而廢,要學就學透學完整,后面工作效率就上來了。

圖片

我們的專業知識就像這4個空杯子,一個代表AE,一個是C4D,一個是UI,一個是插畫,很多東西都想掌握,于是每天學習一次就往這個杯子澆水一點,但是堅持10天就堅持不下去了,要么學別的,要么沒有動力了,然后導致最后什么都沒學到。

圖片

正確做法是把一件事情學透了,學徹底了再去學下一件事情,你學AE就徹底把AE掌握了,再去學下一個,這樣避免反復,徹底掌握不僅能加速你的成長,更能讓你專業更深!

 

方法五:放下手機,定時間點 

最后這個方法對我來說很有效,學會放下手機,放下干擾,中國口香糖的營業額持續下降,大家知道為什么嗎?口香糖一般都會擺在收銀臺的旁邊,因為用戶在超市收銀臺排隊的時候,都在玩手機,沒有人去看前面的貨臺!可見手機對我們影響有多大,所以當你準備學習時候,或者去完成一個任務時候,最有效就是手機放起來,至少一個番茄時間不要去看,這樣保證你的效率變高。

另外一個方法就是定時間點,定結束時間點很重要,人對于時間點都是有天然遵守的,比如地鐵錯過末班車就回不了家,火車飛機晚點你也回不去,所以我們做事情時候可以立一個最晚完成時間,然后去做,比如我寫作,定的時間就是每周末必須寫完,所以我周末再忙,都會去抽空寫完。

 

最后 

今天分享的這些經驗,都是我實踐過并有效的方法,希望可以幫助到大家一同實踐起來,照著做下去,你會發現能壓縮至少1/3的時間出來,讓我們都把時間花在正確的事情,和正確的人身上,快樂工作,快樂成長,快樂生活!

 

原文地址:我們的設計日記(公眾號)
作者:sky

轉載請注明:學UI網》5個技巧,讓你的做圖效率翻10倍!

藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷   作者:陳皮Celia 

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務

設計沉思錄 | B端商城的客戶鏈路設計

seo達人


背景:58會員商城是面向B端商戶的信息服務售賣平臺,囊括了公司各類業務的會員端口套餐、推廣商品、增值服務等商業化產品。長期以來公司的商業交易主要依賴電銷團隊、線下銷售團隊來完成,戰略層希望將線下銷售模式向線上模式轉變,建設一個以客戶為中心的售賣平臺。

 

01.B端商城的認知探索

說起商城,作為普通消費者第一印象就是京東、天貓、淘寶、拼多多等耳熟能詳的電商平臺。在早期,我們也先入為主地以為商城的參照系是C端電商,以最基本的購物流程和商品信息架構入手。
 
然而在項目推進過程中,發現B端商城與C端電商有著孑然迥異的特征。為了調整原有的設計模式,讓整體的商業服務能更貼合客戶實際使用訴求,我們也先從研究入手,探索商城真實的客戶情況。
 

調研花絮&物料

 

02.B端客戶差異

從研究中發現,比起獨立個體的C端消費者,B端客戶往往目標更明確、決策要素更集中。

 

C端電商的客戶

  • 用戶:以獨立個體為主
  • 流程:導流-列表-詳情-訂單-支付-物流-收貨
  • 商品:以圖片介紹為主,多為大眾化消費品,認知成本低
  • 目標:靈活,分散,以興趣、生活需要為導向

 

58會員商城的客戶

  • 用戶:既有公司團體,也有商戶個體、獨立個體
  • 流程:渠道轉化-注冊身份-選擇套餐-付費下單-確認合同-認證資質-開通使用
  • 商品:信息服務類商品,認知成本高
  • 目標:聚焦,為業務運轉而采購,推廣預算明確,追求商業效益最大化

 

具體來說,58會員商城的客戶一部分來自企業間的框架合作,例如房產推廣客戶,大型中介品牌與58同城達成了合作協議(業務側稱之為KA客戶),定期從商城購買大批量的經紀人推廣套餐會員,購物這件事兒對他們來說反而成了例行任務;另一部分來自電銷推廣,例如本地服務商家在業務員的推廣轉化下來到商城購買商戶推廣套餐;還有一部分是個體商人、經紀人,通過公開渠道自主下單。
 
這些客戶從購買的服務內容、購買的機制規則來說都有不同的差異。對于商城設計師而言,更需要關注客戶差異所帶來的購物效率、成功率等問題。

 

  • 效率問題:KA客戶采購模式與購物流程的矛盾
  • 成功率問題:客戶心智與商品選擇難度的矛盾

 

03.客戶鏈路設計

本著給客戶提供更好的商城售賣服務,根據上述關鍵問題,我們進行了針對性的流程鏈路梳理,探索更優解的方案設計。
 

· KA客戶采購模式與購物流程的矛盾

KA客戶的采購模式與C端電商經典購物流程截然不同。

首先,客戶需要經歷繁復的線下任務:i.跟門店經紀人收集名單;ii.整理經紀人開通時間&套餐類型;iii.與業務員審核名單信息。
 
然后才是進入商城-選擇商品-上傳名單-付費下單。根據KA客戶的管理規模不同,每個月需要多次進行線下收集任務,周期性為旗下經紀人開通推廣套餐。而收集環節中的名單信息存儲在公司內的另一個業務系統中,C端電商的線性流程不能在這場景上互融互通。因此,我們需要進行新的流程設計,聚焦KA客戶的采購場景,提升客戶購買效率。

KA客戶流程改造示意圖

 

在新的流程中,將線下任務轉移到線上,大幅縮減了參與人員類型和多個流程環節。用戶經由KA客戶專屬入口,進入采購模式,通過名單管理機制完成添加、管理等操作。根據名單結果匹配對應的套餐組合和優惠策略,引導KA客戶進行批量下單。通過系統流程的互通改造,打通原有操作屏障,提升采購流程的流程性與體驗。

KA客戶改造方案

 

不僅如此,還有更多細分場景,例如經紀人到期續費、新員工入職開通套餐、經紀人自主申報加開套餐等等。這些環節貫穿了KA客戶及其員工們的工作生命周期,通過關鍵服務觸點打磨和數據的融合,讓客戶能夠更快捷獲取信息通知、套餐管理、推廣服務管理,從而形成完整的KA客戶服務鏈路。而全鏈路設計非一日之功,這也是我們正在持續研究和挖掘的方向。

 

· 客戶心智與商品選購難度的矛盾

與KA客戶不同,黃頁商家客戶更接近于普通消費者。用戶在業務員的引導下進入商城采購,這期間用戶面臨的主要挑戰是:

1.復雜的業務分類

2.雷同的商品內容

在原先設計中,采用了扁平的C端電商篩選邏輯,篩選信息密度高,使得商家客戶容易忽略城市、行業類別對套餐的影響,導致買錯套餐、退單重買的情況頻頻發生。再者是信息服務類商品的大量雷同,需要業務員反復與客戶介紹套餐資源差異,影響購物決策效率。因此,對于這類場景,設計師的目標就要聚焦商家客戶的購物成功率,通過改造篩選路徑提升交易準確性和體驗。

 

商品列表問題

 

新方案中,先解決用戶第一個挑戰:聚焦“行業類別”選擇。通過蒙層的方式,讓用戶聚焦自身的業務類型,再結合業務關鍵詞的搜索匹配,避免海量類目干擾。
 

商品蒙層引導

 

接著讓用戶去完成下一個挑戰:選擇會員套餐。
 
信息服務類商品不像大眾消費品有物理實體,可以通過照片去判斷感知,更多情況只能通過文案描述來傳遞商品信息。那么,如何讓用戶感知文案差異也是設計的關鍵。通過信息清單的對比設計,來呈現不同規格的套餐內容。我們還衍伸套餐PK工具、自助餐模式,來應對信息服務商品的差異化感知問題。
 

商品信息對比設計

 

完成以上購物流程的改造、商品信息感知的設計之后,我們也逐漸發現:不同客戶之間雖然有購買場景的差異,但也在商城有著共同接觸的服務節點。

 

04.鏈路的整合與延伸

為了讓好的設計服務到更多用戶,我們需要從系統的角度去考慮如何讓流程路徑更具兼容性、讓商城服務更具通用性。

 

· 業務分發路徑

商城原先是以商品類型的分類邏輯進行組織,不同業務線與不同類型的商品交織混雜在一起。用戶不能在業務分類下檢索全部商品。在新的客戶鏈路設計下,需要融合業務線客戶特征、業務線商品特征等情況,因此需要調整為以業務類型為主的分類邏輯,在首頁中強化業務分類,并將原來的商品列表頁改成業務線大類頁。讓不同業務的商家、不同體量的客戶各得其所。
 

商城框架改造示意

 

· 公共服務觸點

我們收集了客戶在購物不同階段所可能接觸的內容:購物前—咨詢客服、了解業務介紹&商品規則;購物中—對比商品信息;購物后—引導開通資質。根據這些環節沉淀了公共的客服幫助中心,信息卡片規則,商品信息的流轉結構、售后流程節點引導等等,通過細節的打磨和設計,給予用戶更清晰、更便捷的指導,以此帶來更方便的自助服務體驗。
 

公共服務觸點梳理

 

05.最后

回想起來,B端商城的核心設計思想依然還是“以用戶為中心”。差別大致在于:C端是要去驗證用戶痛點的真偽,以“點狀”思路驗證可行性;而B端是要去支撐用戶的業務鏈路,以“面狀”的流程通路去滿足業務基本的運轉需要。在這樣的項目中,作為設計師需要進行更多思考,由“點“及“面”,不斷探索用戶與業務的邏輯交織,像個蜘蛛俠一樣跳躍在邏輯的塔樓。

 

原文地址:58UXD(公眾號)
作者: 環鐵藝術家 

轉載請注明:學UI網》設計沉思錄 | B端商城的客戶鏈路設計

藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷   作者:陳皮Celia 

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務

那些小眾而獨具美感的網站

濤濤

提升眼界,除了與優秀的人為伍

還要多看、多分析、多積累、多沉淀

不斷擴展自己的能力邊界

人生里最大的運氣,不是撿錢,也不是中獎,而是有人可以帶你走向更高的平臺。其實限制人們發展的,不是智商學歷,是你所處的生活圈子、工作圈子。


所謂的貴人:

“就是開拓你的眼界,帶你進入新的世界的人。明天是否輝煌,取決于你今天的選擇和行動!”


今天特意為大家準備了一波小眾而獨具美感的網站


我們要知道

很多時候一條有價值的信息

可以改變你的設計人生


自己平時上國外網站比較多,這里分享我最近瀏覽的優秀網站。

希望可以讓你眼前一亮,哈哈。




undefined



1、Banorama


官網:https://banorama.banenor.no/?ref=reeoo


乘火車旅行是安全的,但這是為了安全。學習你應該注意的事情,并用quizen測試你的知識。





2、Polywork


官網:https://www.polywork.com/?ref=reeoo


Polywork是一個專業的多層網絡。





3、Discord


官網:https://discord.com/?ref=reeoo


不和是通過語音、視頻和文本進行交談的最簡單的方法。與朋友和社區保持密切的溝通、聊天、宿醉和保持密切聯系。





4、Theodoz


官網:https://www.theodoz.com/?ref=reeoo


使用我們強大的平臺和安全令牌協議創建最透明和可編程的金融應用程序。利用分布式基礎設施的強大功能,我們使全球數十億無銀行存款的人能夠獲得標記化的資產投資和融資。





5、Affinity Designer


官網:https://affinity.serif.com/en-gb/designer/


親和設計師-最快,最流暢,最精確的專業平面設計軟件。





6、Warm Christmas


官網:http://warm-christmas.com/home/


溫暖的圣誕節-圣誕老人很熱,所以他為你準備了一個驚喜…





7、Despicable Me 3


官網:https://www.uphe.com/movies/despicable-me


官方電影網站為卑鄙的我3,主演史蒂夫凱爾和克里斯汀Wiig。看這里的拖車。2017年6月30日在電影院。





8、Renaud ROHLINGER


官網:https://renaudrohlinger.com/?ref=reeoo


投資組合-創意開發商雷諾·羅林格





9、Belazor Technologies, Inc


官網:http://belazortech.com/?ref=reeoo


Belazor Technologies,Inc–是無線建筑的驕傲。





10、Day of the Dead


官網:https://dayofthedead.holiday/


是一個紀念死者的節日。探索充滿活力的傳統、美味佳肴以及讓這一天煥發生機的一切!





11、Staak


官網:https://www.staak.co.uk/


皇家利明頓水療中心的獨立創意機構、工藝、洞察、心。





12、East.Paris Agency


官網:http://east.paris/


是一家以文化藝術為靈感,以創意為動力的廣告公司。


undefined




13、Dotlung


官網:https://dotlung.com/


一家培育和成長為具有強大在線身份和社區的成熟數字龍的網站





14、Spot the Bot


官網:https://spot-the-bot.com/


通過瀏覽器在虛擬現實中玩機器人!和一個朋友一起找出盡可能多的機器人。





15、ANIMAL


官網:https://animalmade.com/


我們是動物問題的解決者,講故事的人,藝術家,概念思想者,還有那些喜歡開玩笑的人。









1、Affinity 


官網:https://affinity.pt/en


Affinity是一家專業從事技術和信息系統的咨詢公司。它經營三個不同的業務領域:近支撐、外包、軟件和產品開發。它在里斯本和波爾圖設有辦事處,擁有200多名員工,在17個國家開發項目。


Affinity定位于一家全球服務技術公司,擁有技術概況方面的橫向技能和綜合內部或客戶項目管理。


從戰略上講,除了開發各種語言和技術之外,Affinity還將繼續投資創建自己的軟件。在內部和外部,親和專注于雙贏的關系,將所有的互動時刻定義為“一生的體驗”。





2、Dinamica Plataforma


官網:https://dinamicaplataforma.com/estrategia/


Dinamica Plataforma是一家從事圍繞關系動態、經濟發展、自然資源和領土可持續性展開討論。


undefined




3、1MD


官網:https://www.1md.be/?ref=reeoo


1MD是一家專注于藝術指導、設計和運動的創意工作室,為敢于脫穎而出的品牌打造身臨其境的體驗。





4、Alacran Group Productions and Recording


官網:https://alacrangroup.com/?ref=reeoo


我們致力于在世界各地培養人才、創造機會和建立伙伴關系。


AlalaN組包括AlalaN記錄、錄音工作室、AlalaN圖片、現場活動制作和AlcRAN基金會。



undefined




5、Mogney


官網:https://mogney.com/?ref=reeoo


新一代支付方式





6、KIN


官網:https://kin.movie/


是一部帶有科幻風格的驚心動魄的犯罪驚悚片,講述了一個注定偉大的意外英雄的故事。



藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷  作者:Lili麗麗子

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務




掌握這些Figma進階技巧,讓你的工作效率提升10倍!

seo達人



現在越來越多的公司使用Figma作為主要的軟件工具,在使用Figma時不能按照以前的思維去設計,要盡可能發揮出它的最大優勢,學會進階使用。

 

1.使用組件集

圖片

如果我們有大量的按鈕、輸入字段等變體,在進行任何調整時,都可能花費大量的時間。

圖片

通過使用組件集,可以對其中包含的基礎組件進行調整,然后統一應用到所有的實例中。基礎組件本身不需要成為組件集的一部分,可以放在同一頁或原型附近。

 

2.將封面圖添加到Figma文件中

圖片

當管理各種不同的項目和Figma文件時,有時候尋找需要的項目可能會很費力。

創建封面照片是一種簡單而優雅的解決方案,使項目一眼就能被識別。

添加封面的步驟:

在文檔中創建一個頁面并將其命名為“封面”;

為封面圖像繪制一個框架(1920×960效果最好);

添加一些設計元素如logo、圖標等,讓封面便于識別;

右鍵單擊框架并選擇“設置為縮略圖”。

 

3.使用樣式

圖片

當使用樣式進行設計并決定要測試顏色、描邊粗細、字體樣式等不同變化時,只要快速更改,設計就能自動更新引用該樣式的實例。

 

4.組件集布局

圖片

點擊組件集的框架,然后按shift+a,使用自動布局,輕松組織和重新排序組件。

 

5.使用自動布局

圖片

自動布局使我們能夠更密切地設計產品的開發方式,并在設計文件中保持一致性和可擴展性。

圖片

通過遵循使用自動布局設計,可以在刪除/添加內容、創建響應組件等方面節省大量時間。

 

6.創建流程圖

圖片

為了清晰傳達頁面間的流程,可以嘗試使用一個技巧——將Figma中的連接器復制并粘貼到Figma文件中,它將保留它的所有功能。

 

7.使用約束

圖片

為了保持一個框架的組織性和適應性,使用約束來告訴Figma當我們調整框架大小時頁面該如何響應。

約束幫助我們控制設計在不同屏幕尺寸和設備上的頁面,避免了每次調整頁面時里面的元素也要調整。

如果要忽略框架中對象的約束設置,只需要在調整框架大小時按住command或ctrl。

 

8.為組件創建模板

圖片

為個人資料卡創建一個模板是好的選擇,隨著用戶人數增多,資料卡模板能夠快速地復用,為我們節省大量時間,使設計更輕松。

圖片

模板的工作原理:假設一個博客組件中包括一張圖片和一些文本,再創建另一個組件,在其中嵌套10次博客組件。把這個模板放到設計文件中,如果我們需要添加內容或者調整組件之間的空間,我們只需要在主組件上進行調整。

 

9.組織組件

圖片

考慮使用按鈕、顏色樣式、輸入等來組織組件,這樣更能提高功共享的效率。同時從一個設計文件組織排版的好壞,也能看出來這個設計到底怎么樣。

 

10.使用Loom插件

圖片

Loom插件是遠程工作時必不可少的工具,能夠節省會議時間,讓設計師把更多時間投入到設計中。

圖片

如果設計團隊的日程安排混亂、不在一起辦公或者在不同的時區,都可以嘗試使用Loom插件進行設計評論和共享。

 

原文地址:medium.com

作者:Danny Sapio

譯文地址:Clippp設計夾(公眾號)

譯者:Clippp

轉載請注明:學UI網 ? 掌握這些Figma進階技巧,讓你的工作效率提升10倍!

藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷   作者:陳皮Celia 

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務


如何讓按鈕設計的更迷人

seo達人



按鈕在UI界面設計中是不可或缺的元素之一,這篇文章我們將介紹不同類型的按鈕包括按鈕的狀態和交互。我們介紹的都是日常界面中使用的普通按鈕,并不包括單選按鈕、選項卡、復選框等其他類型的按鈕。

 

按鈕的不同分類如下:

* 動作按鈕

* 常用按鈕樣式

* 按鈕的顏色和形狀

* 按鈕狀態和反饋

* 標簽按鈕

* 觸摸屏按鈕

* 按鈕的位置

* 系統按鈕

* 總結

 

動作按鈕 

我們將分析按鈕的層次結構和它們通信的語言。雖然有些按鈕通熟易懂,但按鈕操作不取決于它們的外觀,而是取決于用戶的行為。

 

1_1.行為召喚(CTA / C2A)

在設計中行為召喚按鈕通常會提示用戶注冊/立即購買等。在產品設計中如果強烈建議用戶應該做的事情應該使用CTA按鈕。

行為召喚按鈕

對于CTA按鈕,我喜歡使用圓形按鈕,這樣會更引人注目。

 

1_2.主要操作按鈕

雖然CTA按鈕和主按鈕看起來相同,但我喜歡將它們分開。主按鈕應該是一個強大的視覺指示器,可以幫助用戶完成他們的旅程。主按鈕應該在用戶可能想要“下一步”、“完成”、“開始”等的情況下使用。

主要操作按鈕

對于主要操作,我喜歡使用實心按鈕。

 

1_3.次要操作按鈕

從“返回”的輔助按鈕到“下一步”的主按鈕,或從“編輯”的輔助按鈕到“保存”的主按鈕。輔助按鈕是我們為用戶提供的主要操作的備選方案。

主按鈕旁邊的輔助按鈕的兩種設計

我更傾向于使用線性按鈕或文本鏈接作為輔助按鈕。

 

1_4.三級按鈕

三級按鈕通常用于其他操作,可能暫時不是用戶想要做的事情。比如“添加朋友”、“掃一掃”、“編輯”或“刪除”之類的內容,前提是它們不是主要操作。

不同形式的三級按鈕

一般來說,人們會使用較小或較不突出的按鈕樣式。

 

常用按鈕樣式 

下面我們將介紹常見的按鈕樣式,不同風格的按鈕樣式和他們的使用技巧。

 

2_1.實心

實心按鈕是帶有實心填充的按鈕。

一個實心按鈕

 

2_2.線性和幽靈按鈕

線性按鈕和實心按鈕正好相反,一個沒有填充的按鈕 – 只是一個輪廓。雖然經?;Q使用,但我更喜歡將線性按鈕視為淺色(在白底下按鈕的輪廓和文本顏色深一點更明顯),將幽靈按鈕視為深色(在黑底下按鈕的輪廓和文本顏色淺一點更明顯)。

線性按鈕(左)和幽靈按鈕(右)

 

2_3.圓形按鈕

圓形按鈕其邊緣設置為最大圓角半徑。

圓形按鈕

 

2_4.FAB(懸浮按鈕)

懸浮按鈕是一種巧妙的設計模式,Google Material Design中更加受歡迎。雖然它們可能看起來像一個圖標按鈕,但實際上它們用在屏幕上的主要操作按鈕。

一個懸浮按鈕

如果您想了解有關FAB的更多信息,我建議您在Material Design的網站上查看( https://material.io/design/components/buttons-floating-action-button.html )

 

2_5.文字鏈接

文本鏈接是一種非常簡單的按鈕類型。有幾種不同的方式可以表明它是一個鏈接。它可以是顏色/下劃線/鏈接的文本,甚至就是文本本身(例如“閱讀更多”)。

文本鏈接的不同樣式

在顏色方面,大多數網站使用藍色,因為它是最容易識別的。為什么文本鏈接的顏色會使用藍色?它一直追溯到是萬維網的發明者,在他選擇顏色時發現藍色很酷的一種顏色,即使是色盲的人通常也能看到它。

 

2_6.帶圖標的標簽按鈕

圖標按鈕越來越受歡迎,一些按鈕仍然需要一個標簽來確保按鈕的語意明了。

帶圖標的標簽按鈕

處理圖標和標簽時最棘手的事情是弄清楚字體組合的圖標有多大。

方法1:讓圖標的大小對齊字體的頂線。

方法2:讓圖標的大小對齊字體的行高。需要注意的是確保圖標和字體的組合視覺均衡。

 

2_7.圖標按鈕

圖標按鈕沒有標簽,只是一個圖標。因為它們沒有標簽,所以它們在界面中節省了大量空間。圖標按鈕還可以將其他圖標按鈕一起排列在它們的小空間中。

圖標按鈕具有不同的風格

如果你在為計算機認知度較低的人群設計產品時,我建議使用帶標簽的按鈕 – 尤其是那些很抽象的語意。

 

2_8.帶圖標的文本鏈接

某些文本鏈接可能帶有圖標。這些通常不會在正文中使用。

各種帶圖標的文本鏈接

 

按鈕的顏色和形狀 

在設計按鈕時,需要考慮以下幾個不同的元素。

 

3_1.顏色

在設計產品時,你應該要考慮有視覺障礙的人。為確保每個人都可以訪問你的顏色,你可以使用在線對比度檢查器。我使用的是那個。( https://accessible-colors.com/ )

不同顏色的按鈕

 

另外,在選擇顏色時應該考慮色彩心理學。紅色按鈕多用于刪除,黃色按鈕多用于警示等。

“刪除”、“警告”、“保存”和“更多”按鈕

 

3_2.邊界半徑

邊界半徑為按鈕提供了很多個性化設計。具有更圓半徑的按鈕看起來更有趣。

不同邊界半徑設置的按鈕

 

3_3.投影

按鈕上的投影使按鈕更加自然引人注意。陰影也可用于指示不同的狀態。 ( https://material.io/design/environment/elevation.html#depicting-elevation )

Material Design通過使按鈕在懸停狀態下來達到這個效果。

不同陰影設置的按鈕

 

3_4.標簽樣式

標簽樣式歸結為字體以及閱讀的容易程度。選擇字體時,請確保它清晰可辨。

不同標簽樣式的按鈕

以下是一些簡單的方法可以讓字體清晰易讀:

* 選擇大寫的標簽或大標題。(Material Design使用過帶有大寫標簽的按鈕。)

* 確保標簽顏色與按鈕填充對比較為突出。您可以使用( http://accessible-colors.com/ ) 查看。始終確保您的顏色符合AAA要求。

* 選擇字體時,請確保字體清晰。

 

3_5.垂直內間距

按鈕的大小對界面的可訪問性起著很大的作用。大多數沒有經驗的設計師會說“按鈕的高度應該是36像素”。如果你是為產品系統的設計按鈕。你應該采用所用字體的行高,并在其中添加一定單位的內間距。例如:“我的按鈕標簽的行高為20px,垂直內間距為8px”。

不同垂直內間距的按鈕

為什么會這樣設定呢?這里有兩個原因:

1)有視覺障礙的人可能會增大瀏覽器中的字體,因此他們需要更改字體大小而不會將按鈕高度定死。

2)這也是開發人員創建按鈕的方式-他們在DIV容器中添加內間距,而不是固定高度。

 

3_6.水平內間距

有兩種方法可以接近水平內間距。

 

第一個方法:

使按鈕寬度與網格對齊。這是保持所有按鈕長度一致的好方法。但是它限制了你可以使用的字體數量。

寬度由網格決定的按鈕

 

第二個方法:

兩側有固定內間距。我通常還會定按鈕最小寬度,雖然避免了很窄的按鈕,但是最小寬度按鈕可容納的不同字段會讓按鈕看上去不是很均勻。

寬度由內間距和標簽長度決定的按鈕

 

按鈕狀態和反饋 

按鈕狀態讓用戶知道他們是否可以點擊、已經點擊或已成功點擊。按鈕還可以有重疊的狀態。例如可以同時是“點擊”和“懸?!睜顟B。

 

4_1.點擊和禁用狀態

點擊狀態就是鼠標可以點擊按下按鈕的狀態,當然如果用戶沒有完成必要的步驟,按鈕可以被禁用。例如用戶沒有輸入他們的姓名和電子郵件地址,他們就不能提交他們的詳細信息。

點擊和禁用按鈕

 

4_2.懸停和懸停離開(鼠標懸停和鼠標懸停離開)

在PC端按鈕應具有不同的狀態,讓用戶知道它是可點擊的。通?!皯彝!睜顟B和“懸停離開”狀態相反,但也不一定。你應該有效的區分讓用戶感知鼠標懸停在某個按鈕上。

懸停演示按鈕

平板電腦和移動設備上永遠不會出現懸停狀態,因為你的手指無法“懸停”。如果您正在為應用程序進行設計,請不要擔心此狀態。

 

4_3.焦點

焦點狀態可能會讓用戶困惑。如果你的用戶專注度較差,他們可能需要使用選項卡式導航。用戶將點擊“選項卡”在網站上移動,從一個導航鏈接移動到下一個。這意味著按鈕需要有一個“焦點”狀態才能顯示它是“可點擊的或尚未點擊”。

默認的焦點狀態是藍色“發光”,幸運的是,我們生活在一個可以自定義按鈕狀態的時代。大多數設計師對懸停和焦點狀態使用相同的視覺提示。

兩個不同“焦點”狀態的例子

 

4_4.按下

按下狀態是當用戶的光標或手指“按住”按鈕時的狀態。當用戶將手指或光標“釋放”在按鈕上時,該按鈕會指示為“已點擊”。

“按下”狀態的按鈕

 

4_5.點擊

按鈕需要“點擊”狀態以向用戶指示它已被點擊。

“點擊”狀態的按鈕

 

按鈕標簽 

按鈕標簽的訣竅是一致性。我們在產品設計前期需要制定按鈕標簽的規范,以避免以后花更多時間去改變你所有的按鈕標簽。

 

5_1.動詞的用法

大多數按鈕都包含指示按鈕將執行什么操作,例如“保存”、“發布”、“編輯”。雖然“back”和“next”不是動詞,但在接口上下文中,它們的工作方式似乎相同。我喜歡在編寫按鈕標簽時使用“動詞”+“名詞”結構,這會讓操作更具規定性,例如“保存文章”等,而不是“保存”。

 

5_2.案例

你還應該決定使用哪種字體大小寫。以下是我使用的一些規范:

所有大寫字母,例如“NEXT SECTION”,我把它們用于更專業的平臺。Material Design使用所有大寫字母的按鈕。

標題框,例如“Next Section”,我傾向于避免使用標題大小寫,因為它不像句子大小寫那樣容易閱讀。就語調而言,我認為它介于“專業”和“會話”之間。

句子大小寫,例如“Next section”,我把它們用于更“友好”或“對話”的平臺。它更像是一句話,正常我們一句話結束會加一個句號,但是為了設計的美感,請不要加一個句號。

小寫,例如“next section”,小寫按鈕標簽使用頻率較低。

 

5_3.一致性

為按鈕編寫標簽時,請確保一致性。以下是一些我在項目使用的指導原則:

選擇字數:每個按鈕一個、兩個或多個字

選擇大小寫:句子大小寫,或大寫,或標題大小寫,或小寫

標簽結構:如“動詞”+“名詞”,或“動詞”等。

 

觸摸屏按鈕 

桌面按鈕大小調整(單擊)

因為桌面上的光標比觸摸屏上的手指小,所以您可以將按鈕縮小很多。

 

觸摸屏按鈕尺寸(點擊)

麻省理工學院觸摸實驗室的研究表明,人在使用觸摸屏時手指部分是8-10毫米,如果你想避免用戶手指觸摸錯誤,最小目標尺寸需要10毫米或更大。如上所述-我需要較大的按鈕。

那么,你應該做多大尺寸的按鈕呢?專家們說的是:

Material Design建議接觸目標應為48dp x 48dp,不同接觸點之間距為8dp。

雖然我找不到關于iOS設計系統目標尺寸的任何文檔,但一般的理解是,它的最小目標尺寸是44 x 44磅。

如果您在設計大小尺寸方面遇到困難,我強烈推薦Zac Dickerson關于易用性的故事。

 

按鈕位置 

如果你非要放置2個按鈕,主按鈕應放在哪一側?

主要和次要按鈕的兩種不同立場

選項A顯示左側為主按鈕。它可能是用戶首先想要看到的,所以先顯示它。

選項B顯示右側為主按鈕。我們希望用戶首先看到輔助按鈕,方便他們繼續完成他們的旅程。右側的按鈕也表示繼續。

 

系統按鈕 

這里會介紹一些很酷的設計原則和系統。我喜歡Material Design System的按鈕,因為他們的原理是經過深思熟慮的。

Material Design System的按鈕

Material Design 按鈕圖片

Material Design中介紹了按鈕的操作,以及按鈕如何與系統中的其他組件交互。我喜歡用戶在觸摸屏上使用按鈕的交互方式。

查看按鈕部分:

https://material.io/design/components/buttons.html

 

懸浮按鈕在這里查看:

https://material.io/design/components/buttons-floating-action-button.html

 

總結

如果沒有按鈕,你就不能真正構建界面;我們應該更多的關注它們。了解按鈕在界面中是如何設計的?怎樣正確的使用按鈕并為你的用戶提供最佳的體驗?

 

原文地址:UX Collective

譯文地址:水手哥學會計(公眾號)

作者:Tess Gadd

譯者: 水手哥

轉載請注明:學UI網》如何讓按鈕設計的更迷人

藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷   作者:陳皮Celia 

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務



原來設計規范要這樣理解,早知道就好了!

seo達人


@彩云Sky:Hi,我是彩云。經常在讀者群里看到有人討論,面試時被問到設計規范相關問題,不知道怎么回答才好。是不是要回答設計規范的具體尺寸,再把各種適配規則全背下來呢?今天彩云就和大家一起探討下,到底要如何理解并運用設計規范。

 

1.什么是設計規范?

設計規范是一個老生常談的話題了,網上相關的文章也非常多,但我相信有很多設計師對設計規范的理解還是比較模糊,認為設計規范指的就是字體,顏色,控件規范那些,這種理解其實是比較狹隘的。

于我而言,設計規范用一句話總結就是:設計規范是針對特定產品所制定出來的一整套產品標準,包括流程標準,技術標準,設計規則等等。通過這套標準,能減少錯誤發生率并提高設計質量和輸出穩定性。

舉個例子,我在做QQ的3D厘米秀項目的時候,一開始合作方提交的設計資源正確率很低,風格也各不相同。然后為了解決這個問題,我在項目中定義了流程標準,資源標準,cp合作標準等等。通過這些規范讓多個不同設計團隊能合作到一起,提升了整體協作的效率和質量,這些標準就成了設計規范的一部分。

圖片

可以說,每個項目因合作方式,人員習慣,落地形式的不同,所形成的規范是有區別的。所以,設計規范更應該是針對項目來說的,除非是問你Android或iOS這種已經廣泛適用的平臺級規范。不然是很難有標準答案的,回答更應該是一種思路的描述,比如你會如何定義一套規范、解決了哪些問題以及如何驗證這套規范真的助力了產品的體驗提升。

 

2.設計規范的作用

1)遵守用戶習慣,減少認知成本

Don’t make me think。大家都知道,好用得產品都是盡可能的減少用戶思考,不斷去貼近用戶的使用習慣。比如在iOS系統里想返回上一個頁面時,你會熟悉的去左上角找返回操作,但如果把返回操作放在右上角就會很不習慣;再比如對國內用戶來說,他們習慣正確按鈕用綠色,錯誤按鈕用紅色,如果你非要反過來制造所謂的差異化,用戶就會感到困惑,誤操作的概率也可能會大量增加。

圖片

 

2)統一品牌性格

品牌性格不論是大到公司層面,還是小到具體某一個產品,都需要有一套品牌識別體系來約束,只有統一的視覺印象才能更好的讓用戶記住。這些品牌識別體系其實也是設計規范的一部分,在具體執行中,可以根據一些品牌核心概念規范快速做一些風格決策。

比如騰訊QQ的品牌形像風格關鍵詞是青春、互動,敘事和干凈,那么在選擇畫面配色的時候就可以根據關鍵詞指導畫面的選擇,使得整體的畫風得到統一。

圖片

 

3)降低新人學習成本

這里所說的新人不單純指剛入職場的設計新人,也包括剛參與到一個新項目的設計老手,設計規范是能夠以最低的溝通成本實現快速上手。有成熟的控件資源和標桿的設計參考,就算是之前完全沒做過的設計師也能搭建出一個還不錯的頁面。

圖片

 

4)提高開發效率

有了好的設計規范,開發就能把一些常用的樣式進行封裝,在需要復用的場景中直接調用。這樣做,一方面可以通過調用的方式減少樣式代碼的復制使用,提升效率的同時降低軟件包體積,另一方面也可以減少不必要的工作量,方便后期維護。

圖片

 

5)保證設計的一致性

有設計規范的約束,能讓團隊在一個既定的框架內做設計,統一大家的輸出質量,從而保證設計的一致性。

 

3.怎么學習設計規范

設計規范的學習肯定不是靠死記硬背,而是要講究方法,從我自身的經驗來說,我覺得大致可以有以下2個步驟:

 

1)在新手期,多去看一些大廠的設計規范,先建立認知,不要求全部記住。把這些規范當成字典,先大致了解一遍,等真正做的時候拿不準再去查閱就好了。這里推薦幾個必看的大廠設計規范官網,建議收藏。

蘋果iOS設計官網:https://developer.apple.com/design/human-interface-guidelines

谷歌Material Design設計官網:https://material.io/design

微軟Fluent Design System設計官網:https://www.microsoft.com/design/fluent

IBM設計官網:https://www.ibm.com/design/language

Facebook設計官網:https://design.facebook.com

螞蟻金服設計官網:https://ant.design/index-cn

圖片

其實網上很多設計規范,原理之類的文章,源頭都來自于這些大廠規范,想獲得一手信息,最好是自己去這些網站多看看。

這也就是我為什么不寫具體規范數值的原因,因為網上的資料實在是太多太詳細了,寫一些重復的知識實在是沒多少價值。學知識的路上一定不要什么都等別人喂給自己,需要更多的主動性,這樣才能提升自己的學習能力和解決問題的能力

 

2)根據自己要做的模塊,有針對性的找市面上大廠的應用作為參考,直接截圖標注,自己總結規律印象會更加深刻

我開始做UI的時候就這樣學習的,不知道字體該用多大,間距用多大,顏色怎么用,就直接去找相類似的界面截圖參考,量它們的尺寸,吸它們的顏色,然后就這樣一步步的把規范經驗積累起來了。

比如從QQ的動態tab頁面中,我們可以借鑒到很多信息,比如列表的高度,列表左側的圖標尺寸和圓角,間隔線高度和配色,右側的箭頭大小和配色,列表文字的字號和配色,用戶頭像大小和結合的樣式,圖標與文字的間距等等。這些借鑒并非是抄襲,要你做的跟這個界面一模一樣,只是參考這里面的某幾個屬性然后結合自己的產品綜合運用,減少出錯

圖片

發現了嗎?一個優秀的界面設計,上面的任何信息其實都可以拿來參考,就看你會不會用了。

需要強調的是,這些參考來的標準,并非是標準答案,還是要根據自己的實際項目做調整,只是至少知道一個范圍,在這個范圍內不大會犯錯

這就像剛開始做設計時一樣,去參考這些規范相當于做臨摹的練習,這種臨摹是需要的,臨摹的過程中不斷加入自己的思考,然后通過總結,變成自己的知識體系。

 

4.怎樣定義出設計規范

隨著對設計規范理解的加深,自身設計能力的不斷提高,就要開始從設計規范的使用者轉變為規范的制定者了。如何制定針對項目的設計規范呢?我的經驗是在項目過程中把做的好的和踩坑后的正確解法進行總結,并形成文字,積累多了就形成了規范。要把每一次遇到的問題都當成是一次改進流程和規范的機會。

我自己是有隨時記錄的習慣,項目中一旦發現問題就會趕緊把它記錄下來。有時候甚至還蠻期待出現問題的,因為出了問題才能找到優化的機會,自己也能從中找到解決問題的成就感。

曾經在QQ的3D厘米秀項目中遇到過非常多的坑,然后從填坑的過程中慢慢總結出各種設計規范,去幫助項目減少錯誤率,提升設計質量。從最終的產出和結果來看,自身的進步是可觀的,對產品的幫助也比較大,所以很值得去做。

圖片

 

5.使用規范會影響設計的創意性嗎?

剛掌握設計規范的時候,干活是特別舒服的一件事,因為做需求可以很快,好像拼拼組件就能完成。但稍微做久一點時間,又會覺得好像沒啥進步,天天拼組件,擔心影響設計的創意性,真是挺矛盾的。

其實,規范也是要在遵守和引領用戶習慣中不斷迭代的。既要保持大的設計規范框架不變化,又要在設計的過程中給用戶制造驚喜。比如,整個UI的配色和字體需要保持統一,但在一些圖形,動效上可以做出亮點,讓用戶在整個使用體驗中既是沉浸的又能有些小驚喜。規范的打破與重建一定是需要一個動態平衡的過程。

 

總結

設計規范絕對不需要死記硬背,而是要充分理解并靈活使用,才能發揮它的價值。隨著UI行業的不斷成熟,設計工具的簡單化,各種組件化資源和思維越來越普及,可以預見的是未來一般的UI界面會高度組件化,設計師單純在界面上花費的時間可能會越來越少。

這從行業的發展來說,減少了很多體力勞動,讓設計和開發有更多的時間去打磨產品細節,肯定是好事。但對設計師自身來說,省下了以前那種常規設計需求的時間后還能做些什么,設計師的價值又在哪?值得每個設計師去思考。

 

原文地址:彩云譯設計(公眾號)

作者:彩云Sky

轉載請注明:學UI網》原來設計規范要這樣理解,早知道就好了!

藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷   作者:陳皮Celia 

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務


日歷

鏈接

個人資料

藍藍設計的小編 http://www.skdbbs.com

存檔

92国产精品视频_亚洲a级在线观看_国产精品电影观看_国产精品免费观看在线_精品伊人久久97_亚洲人成在线观_尤物九九久久国产精品的特点_成人激情在线播放_成人黄色大片在线免费观看_亚洲成人精品久久久_久久免费视频在线观看_久久精品国产一区_国产一区二区三区18_亚洲欧美中文字幕在线一区_日韩美女中文字幕_日韩视频免费在线
日韩精品高清在线观看| 一区二区三区www| 97精品视频在线| 久久精品国产视频| 欧美高清一级大片| 久久国产精品偷| 欧美成人黄色小视频| 成人黄色免费网站在线观看| 亚洲国产精品成人av| 亚洲欧洲免费视频| 精品国产一区二区在线| 日韩激情视频在线| 欧美高跟鞋交xxxxxhd| 久久久噜久噜久久综合| 久久香蕉频线观| 欧美电影院免费观看| 国产视频精品久久久| 91av在线精品| 欧美在线视频在线播放完整版免费观看| 欧美日韩综合视频网址| 精品久久久久久久久久ntr影视| 夜色77av精品影院| 欧美一级大胆视频| 丁香五六月婷婷久久激情| 欧美成人手机在线| 一本色道久久综合狠狠躁篇怎么玩| 777777777亚洲妇女| 国产精品一区二区三区免费视频| 亚洲大胆人体视频| 亚洲伊人一本大道中文字幕| 国产精品一区二区三区久久久| 国产成人97精品免费看片| 成人国内精品久久久久一区| 国产精品网站入口| 中文欧美日本在线资源| 国产精品女主播视频| 欧美视频免费在线观看| 久久成人av网站| 97超视频免费观看| 成人观看高清在线观看免费| 国产精品久久91| 亚洲天堂成人在线视频| 欧美成人免费大片| 久久这里有精品| 久久久成人精品视频| 亚洲高清久久网| 国产精品人成电影在线观看| 亚洲一区二区免费在线| 日本伊人精品一区二区三区介绍| 久久久久久久久久久亚洲| 日韩精品视频免费在线观看| 欧美激情奇米色| 精品在线观看国产| 欧美久久精品午夜青青大伊人| 91福利视频网| 狠狠综合久久av一区二区小说| 最近中文字幕2019免费| 亚洲福利精品在线| 国产91免费观看| 一区二区三区动漫| 91在线观看免费观看| 国产在线观看91精品一区| 欧美肥婆姓交大片| 黄色精品一区二区| 热久久免费国产视频| 91精品国产高清久久久久久| 91精品国产综合久久香蕉的用户体验| 国产精品日本精品| 亚洲午夜国产成人av电影男同| 亚洲国产精品久久久久秋霞蜜臀| 欧美性xxxx极品hd欧美风情| 欧美极品少妇与黑人| 日韩av成人在线| 亚洲成色www8888| 日韩美女视频中文字幕| 亚洲欧美自拍一区| 久久久成人精品视频| 国产成人极品视频| 日韩黄色av网站| 亚洲国产欧美久久| 国产一区红桃视频| 午夜精品国产精品大乳美女| 国产日韩欧美视频在线| 亚洲欧美日韩另类| 成人中文字幕+乱码+中文字幕| 久久全国免费视频| 日韩欧美国产骚| 91精品免费视频| 亚洲在线免费看| 国产成人免费av| 亚洲女人天堂视频| 日韩在线观看免费高清完整版| 久久精品青青大伊人av| 国产精品中文字幕在线| 日产精品99久久久久久| 深夜福利日韩在线看| 国产精品高清在线观看| 亚洲欧美日韩一区二区在线| 成人精品网站在线观看| 亚洲欧美日韩国产中文专区| 精品久久久国产| 亚洲级视频在线观看免费1级| 欧美亚洲伦理www| 亚洲午夜av电影| 精品国产一区二区三区四区在线观看| 成人在线观看视频网站| 国产成人亚洲综合| 欧美激情在线视频二区| 6080yy精品一区二区三区| 91精品国产91久久久| 日韩人体视频一二区| 国产一区二区三区在线| 国模精品系列视频| 久久男人的天堂| 国产人妖伪娘一区91| 91久久精品国产91久久| 亚洲精品一区二三区不卡| 国产一区二区三区久久精品| 日韩av在线网站| 欧美性视频在线| 久久视频免费在线播放| 国产国语刺激对白av不卡| 国产欧美一区二区三区久久人妖| 美女啪啪无遮挡免费久久网站| 欧美性猛交xxxx久久久| 91久久久久久国产精品| 国产精品欧美一区二区三区奶水| 国产区亚洲区欧美区| 欧美激情在线有限公司| 亚洲第一精品自拍| 久久夜色精品国产亚洲aⅴ| 91国语精品自产拍在线观看性色| 国产欧美va欧美va香蕉在| 精品久久久国产| 尤物九九久久国产精品的分类| 中国人与牲禽动交精品| 亚洲黄色www网站| 奇米影视亚洲狠狠色| 亚洲性视频网站| 一区二区在线免费视频| 亚洲欧美精品一区| 欧美色视频日本高清在线观看| 亚洲天堂免费视频| 亚洲午夜色婷婷在线| 97视频在线观看免费| 成人写真视频福利网| 亚洲一区二区三区乱码aⅴ蜜桃女| 欧洲精品在线视频| 欧美激情一级精品国产| 久久成人av网站| 国产成人久久久| 美女国内精品自产拍在线播放| 欧美裸体视频网站| 久久777国产线看观看精品| www.xxxx欧美| 亚洲18私人小影院| 日本乱人伦a精品| 欧洲中文字幕国产精品| 日韩美女福利视频| 欧美日韩国产精品一区| 91亚洲国产精品| 亚洲三级av在线| 久久久噜久噜久久综合| 欧美在线性视频|