PS繪制灰白色機(jī)械鍵盤(pán)樣式手機(jī)輸入法皮膚圖片
在購(gòu)物車?yán)锔Q視了很久的實(shí)體鍵盤(pán)一直舍不得買?本教程教你如何構(gòu)思并制作一款簡(jiǎn)約擬物風(fēng)格的輸入法皮膚,至少能在手機(jī)上過(guò)上一把實(shí)體鍵盤(pán)的癮。
先看看效果圖:
教程步驟—
01 構(gòu)思草圖
首先要仔細(xì)了解輸入法的組成部分:候選欄+拼音區(qū)+云候選區(qū)+鍵盤(pán)大背景+9鍵鍵盤(pán)+26鍵鍵盤(pán)+上劃彈泡等。
剛開(kāi)始著手設(shè)計(jì)的時(shí)候,建議從整體入手,大致規(guī)劃好各個(gè)部分的設(shè)計(jì)元素的擺放位置等,盡管這樣的工作無(wú)法得到立竿見(jiàn)影的成效,但這的確是筆者經(jīng)過(guò)慘痛的教訓(xùn)后得到的寶貴經(jīng)驗(yàn)。一開(kāi)始把整體的設(shè)計(jì)布局確定好了,之后就算有改動(dòng)的地方,通常也只是小改,否則…
一句話,天才第一步,構(gòu)思皮膚整體布局。
本次參賽作品選用了深受部分程序員喜愛(ài)的ikbc 1系鍵盤(pán)Poker作為擬物原型,畢竟是擬物風(fēng)格的輸入法皮膚,所以設(shè)計(jì)過(guò)程中遵循了“盡可能像”的設(shè)計(jì)原則。
此圖為實(shí)體鍵盤(pán)官網(wǎng)宣傳圖。

這款鍵盤(pán)的特點(diǎn)“60%鍵位”“小巧”,即精簡(jiǎn)了鍵盤(pán),用戶不需要上下左右移動(dòng)手腕,即可保持較高的的輸入效率。所以在皮膚的設(shè)計(jì)中,為了體現(xiàn)這種簡(jiǎn)潔的設(shè)計(jì)思想,未在工具欄、候選欄、云候選區(qū)或拼音區(qū)區(qū)域做任何設(shè)計(jì),簡(jiǎn)單就好。
而在主體鍵盤(pán)部分的設(shè)計(jì)中,以質(zhì)感設(shè)計(jì)優(yōu)先,鍵槽體現(xiàn)為輔的宗旨著手后續(xù)工作。
02 鍵帽部分
鍵帽部分千萬(wàn)注意不要脫離切圖尺寸而獨(dú)立設(shè)計(jì)!

切圖模板可從搜狗輸入法皮膚比賽詳情頁(yè)獲取
26鍵和9鍵布局的鍵帽大小差異較大,先獨(dú)立設(shè)計(jì)而后進(jìn)行拉伸復(fù)制很有可能導(dǎo)致邊緣圓角(如果有的話)變形,出現(xiàn)鋸齒或過(guò)渡不自然等情況。故而強(qiáng)烈建議帶圓角的鍵帽,直接基于26或9鍵的切圖尺寸的框架內(nèi)進(jìn)行設(shè)計(jì)。
本次參賽作品的設(shè)計(jì)較為簡(jiǎn)單,使用圖層樣式表達(dá)出實(shí)體鍵盤(pán)質(zhì)感即可,不需要進(jìn)行其他的效果制作。故而質(zhì)感在表現(xiàn)時(shí),相對(duì)須設(shè)計(jì)地較為精致耐看一些,否則可能會(huì)顯得較為單調(diào)。同理,盡管實(shí)體鍵盤(pán)的配色基本為黑白灰,但在實(shí)際的質(zhì)感表現(xiàn)時(shí),一定注意,灰度的層次感要相對(duì)拉開(kāi)。此外,其實(shí)仔細(xì)觀察,實(shí)體鍵盤(pán)在不同鍵位上的鍵帽上手指敲擊處的斜度處理也有所不同,故而在本次參賽作品中筆者也有所還原(9鍵中較為明顯),不過(guò)由于時(shí)間緊迫,未來(lái)得及做出上下傾斜的感覺(jué),實(shí)屬遺憾。

標(biāo)簽(TAG) 機(jī)械鍵盤(pán) 輸入法皮膚 輸入法圖片 手機(jī)輸入法 機(jī)械鍵盤(pán)圖片 PS繪制鍵盤(pán)圖片