發(fā)布時(shí)間:2023-12-26 20:56:42 瀏覽量:155次
UI設(shè)計(jì)1
2019年5月11日
今天是我距離30歲的倒數(shù)第305天
這里是我的設(shè)計(jì)成長(zhǎng)筆記
—————————————————
經(jīng)歷過之前的成長(zhǎng)后,開始正式接觸UI設(shè)計(jì),
主要還是因?yàn)槭袌?chǎng)缺口的原因,
移動(dòng)互聯(lián)網(wǎng)的普及,讓UI設(shè)計(jì)如火如荼,再加上大眾創(chuàng)業(yè)萬眾創(chuàng)新的政策,好像全民都在做app了。
在加上資本的錢都開始流向這邊,果斷投身到了行業(yè)大軍中去。
最開始的時(shí)候也是迷茫的,
雖然有了一些電商設(shè)計(jì)的基礎(chǔ),知道一些尺寸,適配的問題,但是對(duì)這個(gè)行業(yè)的認(rèn)知還是空白的。沒有框架,沒有基礎(chǔ),對(duì)于想步入這個(gè)行業(yè)來講還是有些困難的,好在設(shè)計(jì)思維邏輯的基礎(chǔ)讓我沒有最開始學(xué)設(shè)計(jì)的時(shí)候那么慌張。
首先是了解這個(gè)行業(yè)
前期買了好多書籍資料,但是感覺沒什么用,原因是UI設(shè)計(jì)屬于這些年才發(fā)展起來的,大家都是在摸索過程,走在前面的人總結(jié)的經(jīng)驗(yàn)寫成了書,但是隨著技術(shù)的更新,很多經(jīng)驗(yàn)已經(jīng)不適應(yīng)當(dāng)下的情況了,所以學(xué)UI不建議買太多書,包括學(xué)軟件的書我也不建議買,反正我買了挺多也就最開始入門的時(shí)候感覺能學(xué)點(diǎn),后來就越來越覺得這些東西網(wǎng)上都能查的到,當(dāng)然如果你搜索引擎用的實(shí)在不好,那就買吧,花錢節(jié)約時(shí)間。
UI設(shè)計(jì)(或稱界面設(shè)計(jì))是指對(duì)軟件的人機(jī)交互、操作邏輯、界面美觀的整體設(shè)計(jì)。UI設(shè)計(jì)分為實(shí)體UI和虛擬UI,互聯(lián)網(wǎng)說的UI設(shè)計(jì)是虛擬UI,UI即User Interface(用戶界面)的簡(jiǎn)稱。
UI設(shè)計(jì)的職能包含三塊:圖形設(shè)計(jì)、交互設(shè)計(jì)、用戶研究
圖形設(shè)計(jì)負(fù)責(zé)落地的界面設(shè)計(jì),交互設(shè)計(jì)負(fù)責(zé)操作流程、軟件結(jié)構(gòu)、操作規(guī)范等,用戶研究負(fù)責(zé)調(diào)研測(cè)評(píng)提供佐證。
這樣其實(shí)還是很難理解,先了解一下即可。
我的學(xué)習(xí)方法是帶著問題去學(xué),所以我了解了大致后,就以我想做一個(gè)app的問題出發(fā)了。
在這個(gè)問題引導(dǎo)下,我開始搜集這個(gè)行業(yè)的工作流程是什么,如果需要做一個(gè)app需要準(zhǔn)備哪些材料,需要使用哪些軟件等等。
大問題拆分成小問題,逐個(gè)擊破
先是工作流程,開發(fā)一個(gè)app需要的工作是首先你得有個(gè)idea,知道自己要做什么類型的app,這個(gè)app可以解決什么問題,(這個(gè)階段其實(shí)就是用戶研究的階段了)我仍然沿用之前做設(shè)計(jì)的思維邏輯,選定好自己要做的類型后,搜集競(jìng)品,看、想、記錄。
做了一些記錄,畫了一些草圖(后來發(fā)現(xiàn)這些草圖就是產(chǎn)品經(jīng)理所說的線框圖)
把這些草圖一張一張的聯(lián)系起來就成了術(shù)語里的交互流程圖
最終做出來的簡(jiǎn)單版方案就成了原型(那時(shí)候感覺做個(gè)app也挺容易的,但是越往后越覺得自己想多了)
有了原型之后,就開始查怎么落地,發(fā)現(xiàn)各種手機(jī)型號(hào)、尺寸、分辨率一下就懵逼了,以前用的都是pt、px現(xiàn)在又多出來個(gè)dp。
算了,一個(gè)一個(gè)解決吧。先把這些不懂的名詞理解了在往下進(jìn)行。
先是單位
px: pixel,像素,電子屏幕上組成一幅圖畫或照片的最基本單元
pt: point,點(diǎn),印刷行業(yè)常用單位,等于1/72英寸
ppi: pixel per inch,每英寸像素?cái)?shù),該值越高,則屏幕越細(xì)膩
dpi: dot per inch,每英寸多少點(diǎn),該值越高,則圖片越細(xì)膩
dp: dip,Density-independent pixel, 是安卓開發(fā)用的長(zhǎng)度單位,1dp表示在屏幕像素點(diǎn)密度為160ppi時(shí)1px長(zhǎng)度
sp: scale-independent pixel,安卓開發(fā)用的字體大小單位。
好了,看了這個(gè)我還是懵逼的
分一分類吧
設(shè)計(jì)稿其實(shí)就是用px,dp是在安卓開發(fā)的時(shí)候轉(zhuǎn)換使用的,安卓的多樣和手機(jī)屏幕像素密度的不同,為了設(shè)計(jì)圖能夠適配不同的設(shè)備屏幕,所以有了這么一個(gè)單位。(很多的混淆都是在這里發(fā)生的。這個(gè)問題不清楚會(huì)導(dǎo)致后期的切圖適配得不到想要的效果)
比如設(shè)計(jì)師像素為單位畫了一個(gè)4PX*4PX的icon,在160dpi和320dpi的兩種屏幕上會(huì)顯示完全不同。(引用于墨刀,下方附參考鏈接)
為了避免這種情況,所以這個(gè)單位的作用就是倍數(shù)
類似于等比放大,然后根據(jù)這個(gè)倍率切出相應(yīng)的倍數(shù)圖就好了。
隨著技術(shù)的發(fā)展,現(xiàn)在已經(jīng)不需要那么麻煩了,藍(lán)湖、墨刀等這類工具都很方便。
記住常用的尺寸就好了
比如ios開發(fā)就用375*667、安卓就用720*1280,雙系統(tǒng)互通的話稍微調(diào)整一下就好了
在這之后就開始研究IOS和安卓的基本規(guī)范(界面尺寸、布局、控件、icon、字體)
在學(xué)UI的過程中發(fā)現(xiàn)規(guī)范越來越重要,很多錯(cuò)誤都是因?yàn)闆]有按照規(guī)范制作發(fā)現(xiàn)的,然后一個(gè)坑接著一個(gè)坑就出來了,之后我們?cè)俾摹?/p>
好啦,就醬~拜拜
——————————————————————
熱門資訊
1. iPhone6的UI設(shè)計(jì)尺寸規(guī)范,原來如此重要!
想要了解iPhone6界面設(shè)計(jì)的尺寸規(guī)范嗎?這里為您詳細(xì)介紹iPhone6的UI設(shè)計(jì)尺寸規(guī)范,包括界面尺寸、圖標(biāo)尺寸、可點(diǎn)擊高度規(guī)范、搜索欄高度規(guī)范以及界面元素之間的距離規(guī)范。
2. 12個(gè)絕佳的UI設(shè)計(jì)網(wǎng)站,助力你的創(chuàng)作之旅!
將為大家介紹12個(gè)絕佳的UI設(shè)計(jì)網(wǎng)站,這些網(wǎng)站不僅可以為你提供靈感,還可以幫助你學(xué)習(xí)新的技巧,助力你的創(chuàng)意之旅!dribbbleDribbble 是一個(gè)面向設(shè)計(jì)師的...
3. 移動(dòng)端UI設(shè)計(jì)中常見的5種APP界面類型,你get到了嗎?
通過介紹移動(dòng)端UI設(shè)計(jì)中的閃屏頁、引導(dǎo)頁、浮層引導(dǎo)頁、空白頁和首頁等5種APP界面類型,幫助大家更好地了解UI設(shè)計(jì)的基本知識(shí)
4. 移動(dòng)端列表頁和表單頁設(shè)計(jì)秘訣:讓你的APP點(diǎn)擊率翻倍
在移動(dòng)端設(shè)計(jì)中,列表頁和表單頁是不可或缺的部分。一個(gè)好的列表頁和表單頁設(shè)計(jì)能夠讓用戶輕松地獲取信息并產(chǎn)生點(diǎn)擊欲望,從而提高點(diǎn)擊率。本文將為你...
5. 10個(gè)免費(fèi)學(xué)習(xí)UI設(shè)計(jì)的網(wǎng)站 提升你的設(shè)計(jì)能力
怎樣可以提升你的UI設(shè)計(jì)能力!第一個(gè):站酷站酷想必是設(shè)計(jì)師都知道的一個(gè)網(wǎng)站,里面不止有UI設(shè)計(jì)的資源,還有其他設(shè)計(jì)的,不如:平面設(shè)計(jì)、網(wǎng)頁設(shè)計(jì)、字體...
6. 推薦10本適合UI設(shè)計(jì)師看的書籍,輕松掌握技能!
對(duì)于想要提高自己的設(shè)計(jì)能力和創(chuàng)造力的小白和UI設(shè)計(jì)師來說,這本書是一個(gè)很好的選擇。4.《設(shè)計(jì)的覺醒》(IKKO TANAKA)推薦理由: 這本書是日本現(xiàn)代平面...
7. 零基礎(chǔ)學(xué)UI設(shè)計(jì)要多久?培訓(xùn)完能拿多少工資?
探索零基礎(chǔ)UI設(shè)計(jì)培訓(xùn)的時(shí)長(zhǎng)與薪資前景。了解數(shù)字藝術(shù)教育領(lǐng)域的專業(yè)課程,以及培訓(xùn)后的職業(yè)發(fā)展機(jī)會(huì)。
8. 物聯(lián)網(wǎng)APP UI設(shè)計(jì):創(chuàng)造智能硬件領(lǐng)域的沉浸式體驗(yàn)
ui設(shè)計(jì)應(yīng)該讓用戶一目了然,能夠快速找到所需的信息和功能。在設(shè)計(jì)過程中,應(yīng)盡量使用簡(jiǎn)潔的圖標(biāo)、文字和色彩,避免過多的視覺干擾。符合用戶習(xí)慣:ui設(shè)...
9. 設(shè)計(jì)中的色彩心理學(xué):淺析中西方色彩的歷史演變與設(shè)計(jì)應(yīng)用
摘要:本文探討了色彩的歷史演變和設(shè)計(jì)應(yīng)用。通過對(duì)色彩在早期文明社會(huì)中的實(shí)用運(yùn)用、不同文化背景下色彩觀念的差異、色彩在設(shè)計(jì)中的重要性以及新興技...
10. 學(xué)習(xí)ui設(shè)計(jì)的心得
大家今天走運(yùn)了,我就把自己總結(jié)出來的學(xué)習(xí)UI設(shè)計(jì)的一些經(jīng)驗(yàn)與大家一起分享吧。想做一個(gè)好的UI設(shè)計(jì)師除了應(yīng)該具有一定的審美能力,還要了解整個(gè)產(chǎn)品的...
最新文章
同學(xué)您好!