【 設計理論】詳細解析新手如何從零教您學習像素畫

詳細解析新手如何從零教您學習像素畫

這一次的教學是屬於設計理論領域中的設計理論的相關教學。

文章出處是來自優設的設計理論類文章,寫教學的作者是飛屋睿UIdesign,感謝飛屋睿UIdesign提供設計理論的實作教學。

教學大綱:

最近像素畫在遊戲設計、插畫設計等領域又有了逐漸回暖的趨勢,這或許是一種懷舊,或許是對其他設計膩味了。總之,現在是時候問一句:關於像素畫你知道些什麼?如果你是像素畫小白,那今天從頭開始來學習吧。


設計理論教學開始

最近像素畫在遊戲設計、插畫設計等領域又有了逐漸回暖的趨勢,這或許是一種懷舊,或許是對其他設計膩味了。總之,現在是時候問一句:關於像素畫你知道些什麼?如果你是像素畫小白,那今天從頭開始來學習吧。

詳細解析新手如何從零教您學習像素畫

@飛屋睿UIdesign :從太空入侵者到超級瑪麗,舊時代的遊戲行業里好像像素畫這樣的藝術形式已經廣為人知。就像當年小時候我們玩遊戲機時,我們沉浸在玩耍的快樂中,沒有悉心考量這樣的設計是怎麼來的。如果你曾經也像我一樣是個熱愛創作的小孩,那麼在看英雄們揮刀砍倒怪獸時,你也萌發出要畫一張這樣的畫的想法吧?

近些年來,像素畫在遊戲設計、插畫設計以及其他媒體上又有了逐漸回暖的趨勢,這或許是一種懷舊,或許是對其他設計膩味了。總之,現在是時候問一句:關於像素畫你知道些什麼?

像素畫有什麼特點?

詳細解析新手如何從零教您學習像素畫

就我們所瀏覽的一切屏幕上的畫面而言:筆記本電腦、手機、ipad、PC……,它們都由像素構成的。反而我們應該這樣問一句:“那麼什麼又不是像素畫呢?”。它們是繪畫作品,它們也都是由像素組成,因此可以說所有的數字畫面都是像素畫。從技術層面上說這是正確的,而當我們談到像素畫時,我們主要是在說應用在遊戲行業範圍內的一種藝術形式。像素畫是一種在視覺上很明顯由一格一格像素拼湊而成的柵格化的藝術形式。一般而言,像素畫的組成單位比較小,和馬賽克以及十字綉非常類似。由小單位的獨立元素慢慢拼湊而成為一副藝術作品。

許多的圖形軟件都可以用來製作像素畫,只要這個軟件是可以用像素作為基本單位進行繪畫即可,例如windows自帶的畫圖工具就滿足這個條件,並且它也為windows的用戶所熟識。至於其他的軟件,如果沒有邊緣銳利的鉛筆工具和橡皮擦工具的話就不要考慮了。像素畫最重要的特點就在於它看上去構造無論多麼複雜,潤色無論多精巧細膩,它也沒有使用到諸如減淡、加深或形狀等工具。

需要使用到的技巧

詳細解析新手如何從零教您學習像素畫

上圖的像素畫里用到了雲朵和窗戶的遞色以及工具輔助的漸變背景的技巧。

通常,像素畫里的色彩是受限的。在早期(也就是20年前),它的顏色範圍限定於遊戲機和電腦屏幕的色彩範圍。如此,這種叫做“遞色”的技巧才會被採用。遞色就是利用兩種色彩的擺動交互來營造出自然的過渡色彩效果,而無需其他色彩的參與。創作者運用的模式可以是遞色的樣式或者遞色的密度,這完全取決於色彩過渡得是否自然。這種形式與繪畫中的點刻法非常類似。

如下圖中,雞蛋周圍的像素處理經歷了抗鋸齒處理的過程。

詳細解析新手如何從零教您學習像素畫

另一個被使用的技巧叫做抗鋸齒處理,它可以讓一個遊戲角色或一個物件與周圍環境或另一個物件過渡得更自然。由於藝術家們都追求整體效果,也許抗鋸齒處理並非一定要用不可。通常,抗鋸齒處理運用在需要從背景中重點突出的對象上,它讓主角從整體的繪畫風格的作品中凸顯出來(例如玩遊戲時),更容易被玩家認出。

通常,這兩種技巧都可以手動製作,或者利用Photoshop中的工具輔助製作。當像素畫被保存為PNG或GIF的格式(這是兩種最好的格式,由於JPEG格式有組件添加這樣很容易毀掉像素畫的品質),Photoshop提供了有限範圍內的色彩選擇,遞色和抗鋸齒處理或銳利邊緣。同時,你也可以在軟件里重新編輯圖片的大小,而又不損失其清晰銳利的邊緣。

他們說8位是說的什麼?

詳細解析新手如何從零教您學習像素畫

上圖就是一個8位或叫做256色色板的例子。

像素畫的一個極大的趨勢就是在叫做8位設計中被用到,無論它是否真的只用到了8位。在像素畫中,8位是一個與顏色有關的信息。一個8位遊戲機,就像任天堂遊戲機只能出現256色。每種顏色由一組整數表示,那麼8就是那時能被機器存儲下來的整數數量的最高位。當時,顏色的情況就是由3位紅色,3位綠色,2位藍色所組成的256種顏色。有限附加到遊戲里的顏色要依賴於將要存儲多少信息以及遊戲卡盤的訪問量。雖然遊戲機要展示大量的顏色和動畫,但是在遊戲處理和運行時,有限範圍內的設置就能加快遊戲呈現的速度。

90年代初,像任天堂二代和世嘉五代這樣的遊戲機已經是16位,顏色範圍增加到了65536種。這樣就對遊戲場景提出更高的要求:更柔和的漸變、更複雜的設計。隨着時代發展,遊戲機和電腦已經可以展示出32位圖像,3D渲染場景已經佔據主流,那些曾經針對像素着色的藝術家們如今着色的是低多邊形。此外,技術逐年發展讓遊戲畫質發展也逐步加快。

什麼是等距像素畫?

這就要說到流行於80年代末街機時代的橫向捲軸遊戲魂斗羅。你會注意到所有的角色都是側面,並且畫面中沒有消失點的存在。那時的遊戲是完全沒有透視效果的。在80年代末到90年代初的超級瑪麗遊戲也擁有相同的特點。此外,像塞爾達傳說:眾神的三角力量這樣的遊戲里出現了從頭頂往下鳥瞰的視角,從高空位置往下凝視可以將建築物一起盡收眼底。這就為圖像展示增加了維度,也增加了遊戲中的角色,但是,整體看上去與後起之秀——3D渲染遊戲比起來仍然顯得扁平。

想自己繪製漂亮的等距像素畫嗎?右戳學習!《PS酷炫教程!手把手教你繪製個性十足的像素畫》

詳細解析新手如何從零教您學習像素畫

詳細解析新手如何從零教您學習像素畫

上圖的左邊展示的是等距像素畫的基本構成線條,而右邊是着色后的樣子。

當有人提及一件像素作品為“等距”時,他們談論的其實是平行造型的類型,這種叫做“等距建模”的造型讓至少3/4的視圖畫面看上去更加精確。它的立體感不強,但也不如剛剛我們提到的遠景類型里的像素畫效果那般扁平。廣為人知的的等長像素畫的遊戲是1982年的經典遊戲“Qbert”。雖然Qbert自己的角色是扁平的,但是他跳起來時候就能看到每個盒子的頂部和兩邊。在大部分對角設計中,Q*bert移動全靠這樣視圖來支持。

在非遊戲設計中像素畫又有哪些用途?

詳細解析新手如何從零教您學習像素畫

雖然像素畫最廣泛的用途就是遊戲行業,但在其他領域裡,它仍然也是一種藝術形式。像素畫創作者們一般都被大家認為是一群公仔大師,他們利用在遊戲行業里的8位和16位的技術創作出公仔的身體,頭髮,服裝以及數字作品里的圖標。

詳細解析新手如何從零教您學習像素畫

從上世紀90年代末到本世紀初期都出現了很多這樣的網站,他們充斥着各種GIF動畫,圖標,整個布局都是由像素畫藝術形式進行潤色。風靡韓國的流行網站,例如iBravo和Sayclub讓用戶為他們自己的網絡形象購買組件,並且能和他人進行互動。

此外,網站上創建出的形象還能增加卡通公仔,用戶可以通過提前準備好的公仔的服裝、配飾來製作一個公仔,將公仔展示到例如MYSPACE這樣的個人主頁上。

詳細解析新手如何從零教您學習像素畫

表情的形象化和可愛感最初都是通過像素的形式來表現的。為了達到這兩點,他們通常在早期的社會媒體、留言板和即時通訊里展示出它的特質。例如心情,動作或其他肢體語言溝通。十五年前,小男孩的動畫圖標就在AOL的即時通訊里大為流行。

90年代的電腦里的圖標也是像素畫的。你的鼠標指針,十年間並沒有任何改變,它仍然是非常簡單的像素畫的藝術風格。非常有趣的是,再過了十年,大多數像素畫已經為矢量圖形所取代。卡通公仔,網站圖標,所有網站的布局甚至更多都是矢量圖形了,這也許歸因於多尺寸展示的需求,因為我們現在已經有太多設備(電腦,筆記本,手機……)。

作為一門懷舊的藝術

詳細解析新手如何從零教您學習像素畫

撇開像素畫的實際運用不談,從那些我們童年玩過的遊戲里吸取靈感,藝術家們創作出的插畫和其他的設計作品完全從藝術的角度出發。像素作品被放大,而每個像素格的邊緣保持了其精確度,通過這樣就創作出像馬賽克一樣的作品。而另外一種創作手法是在一個很大的繪圖平面中創作很小尺寸的對象,這種作品有點類似於“威利在哪裡”這本書的風格。無論哪種形式,都在很大程度上抓住了過去的藝術風格。通過創作這樣的懷舊藝術作品,我們的互動平台也跟着開始分享出來關於過去的一些回憶:遊戲機,互聯網和早期的社交媒體。

或者,比起它的實用性而言,藝術家們也許僅僅是欣賞像素畫的外觀表現。它開始日漸流行起來,在服裝、配飾領域,目前又重新出現在了遊戲平台上。

或許你也許還沒有打算敞開懷抱接受它,但至少你知道這也是你童年時候的一部分。

–本文轉載自 http://www.missyuan.net 教學網 —

文章永久連結為: 詳細解析新手如何從零教您學習像素畫