1. 程式人生 > >【互動媒體】畫素風畫板

【互動媒體】畫素風畫板

想要創作這樣的作品嗎?我們為你準備了一件趁手的好工具!
在這裡插入圖片描述
(通過本畫板創作)

前言

創作背景與目的

“畫素風”是一種電子時代的復古美學,它產生於上世紀八九十年代,遊戲開發者限於裝置效能,只能用一個個畫素點來堆積人物和場景,創造了許多經典佳作。時至今日,遊戲畫面早已變得平滑,“畫素風”卻反而成了一種特殊的技藝,獲得了眾多藝術家的喜愛。

我們這個畫板的靈感來源於“畫素遊戲”。在時光的長河中,許多畫素風的作品經受住了洗禮,從眾多類別的作品中脫穎而出,成為經典。我們最熟悉的莫過於在紅白機時代就已經出現的超級馬里奧。
在這裡插入圖片描述


而當下的“畫素風”熱潮帶來了一波復古的遊戲與畫作。最著名的應該是沙盒類遊戲“我的世界”。
在這裡插入圖片描述

並且在網際網路上已經有許多藝術家把我們當前熟悉的事物進行了畫素化,比如畫素風的emoji和畫素風的蜘蛛俠。
在這裡插入圖片描述
在這裡插入圖片描述
如果你也想要創作自己的畫素作品,但是又不知道從何下手,我們這個畫板就能助你一臂之力。並且我們的畫板還有一些會令你驚喜的功能,讓你的畫素風作品能夠技壓群芳。

畫板介紹

模組介紹

畫板介面
畫板主要有5個模組

  1. 畫板主介面,該介面用於作畫和塗色,以及後期的效果呈現
  2. 畫板和筆刷設定,包括:
    ·畫板背景顏色
    ·畫板網格顏色以及透明度
    ·筆刷顏色
    ·筆刷功能設定(是否塗色和是否拉伸)
  3. 塗鴉風格設定,包括:
    ·開啟塗鴉模式
    ·塗鴉的潦草程度
    ·塗鴉的線寬
    ·塗鴉線之間的平均距離
    ·塗鴉線的傾斜角度
  4. 閃粉粒子設定,包括:
    ·開啟新增閃粉模式
    ·閃粉粒子的數量、大小、顏色、運動速度
    ·閃粉粒子的運動模式選擇
  5. 儲存作品時的檔名以及幫助模組

以上功能只需要有一個印象即可,在後文中會被多次提及。

使用方法

讓我們使用這個畫板進行一次案例教學。視訊如下。
http://v.youku.com/v_show/id_XMzk5MDY3MTIwOA==.html?spm=a2h0j.11185381.listitem_page1.5~A
案例的成果:紅玫瑰
在這裡插入圖片描述


看完視訊之後,對這個畫板的工作流程有了一個大致的瞭解,現在來對功能進行一些補充說明和詳細介紹。

1、單擊滑鼠左鍵進行網格拖動
在這裡插入圖片描述
2、單擊滑鼠右鍵進行區域性還原
在這裡插入圖片描述
3、單擊空格,進行全域性還原(包括網格的整體移動與放大)
在這裡插入圖片描述
4、滑動滑鼠滾輪改變受力範圍
在這裡插入圖片描述
5、點按滑鼠滾輪切換力的大小
在這裡插入圖片描述
6、按住‘G’鍵,使用滑鼠左鍵進行網格整體拖動
在這裡插入圖片描述
7、按住‘G’鍵,使用滾輪進行網格整體縮放
在這裡插入圖片描述
8、點選‘Z’鍵,撤銷一步
在這裡插入圖片描述
9、點選‘S’鍵,儲存當前畫作
在這裡插入圖片描述
10、在GUI中可以一鍵將畫作轉換成塗鴉風格
在這裡插入圖片描述
11、在GUI中可以進入加閃粉模式
在這裡插入圖片描述

記不住嗎?記不住太正常了,所以點選頁面左上角的幫助中心即可獲取幫助頁面。
在這裡插入圖片描述

畫板亮點

  1. 畫板的完成度特別高,不僅僅是簡單的在畫板上留下痕跡,並且具有非常多一個畫板應該有的人性化的實用功能。比如像PS一樣可以拖動、放大和縮小畫布,可以撤銷返回上一步,還可以儲存當前畫作。
    尤其是撤銷,這一步雖然看上去簡單,但是背後的程式碼量巨大,需要一個新的資料棧進行每一個操作的儲存,要能夠實現棧的先進後出。
    但是如果不提供撤銷,畫板的可使用性就會大大降低,畢竟大多數人在畫畫的時候還是希望有一個橡皮擦在身邊,而不是在畫錯一筆之後就要重新開始。

  2. 畫板的趣味性非常高。可以對網格進行拉伸,然後塗色,也可以先塗色然後再改變網格。這種類似繪畫,但是又與傳統的紙筆繪畫不同的體驗能夠激發人們的創造力。目前的玩法是我們團隊在各種可能性中選擇的最佳的畫素畫的作畫方法。
    在設計過程中,我們團隊為了增加更多的趣味性,特意增加了塗鴉風格的轉換以及閃粉粒子系統。在畫完網格畫素畫之後,進行塗鴉風格轉變或者加一些粒子,有時候效果真的會給人驚喜!

  3. 畫板的可玩性極強。雖然在畫板只能進行畫素風格的創作,但是所有最偉大的建築都是在限制最多的條件下建成的,同樣的,最偉大的藝術往往也是在有限制的情況下才能完成。如果直接給藝術家一張白紙,可能他們也難以創造令人興奮的藝術品。拉伸網格這個玩法更是為創作添加了無窮的想象空間。
    在文章末尾貼了一份我們團隊使用這個畫板創作的作品,非常驚豔。

  4. 就像我們目前在畫板中添加了塗鴉風格以及閃粉粒子一樣,如果還有足夠的時間,我們可以繼續新增各種各樣不同的效果,就像外掛一樣。內部的程式碼也進行了介面化處理,之後就像我們目前在畫板中添加了塗鴉風格以及閃粉粒子一樣,如果還有足夠的時間,我們可以繼續新增各種各樣不同的效果,就像外掛一樣。內部的程式碼也進行了介面化處理,在學期結束後,我們團隊還會對這個繪畫系統進行優化處理。

寫在最後

和傳統繪畫相比,我們這次做的繪畫系統的實現過程不同於手繪的實現過程,它更像是一種帶有強烈目的性和容錯性的網格編輯工具,它不像是手繪那樣一筆一筆,一個點一個點的實現(當然據我所知的大部分繪畫系統包括碼繪也都是從一個點出發,以點為基準的),而是以一個點帶動一條或者多條線,實質上是以一條或者多條線段為基準的繪畫。
工具上很大的創新就是我們只有網格,所有的操作其實就是每個小網格的變換一個一個相疊加累積,最後讓所有被牽動的網格形成的大網格完成作品實現。但這結束了嗎,創作就到此結束了嗎?其實還沒。
填色是同樣重要的二次創作過程,而因為是一個一個網格,所以不光填色過程會實現的更快速,填完色的結果也更是另一種只屬於它,像是畫素又是極富個性的畫作。
經過我們的多次應用實現,我們發現在臨摹上,用它臨摹出來的畫作都帶有其強烈的標識,而就像這個時代所展現出來的一樣,越是會流行風靡全球,它一開始就越是帶有標誌性的,我可能有點誇大,但這種標誌性確實很難是由工具造就的,像是各類筆、筆刷、它們是各有其特點,卻很難讓通過它們呈現出的作品同樣帶有強烈的個性,讓每個使用者或者說繪畫主體都能充分展現出工具的作用,其實一個工具,它的功能和全部用途如果能被大多數甚至全部人知道,那它就是一個很好很好的工具,才是真正從使用者出發。
侷限性肯定是有,很多功能我們想到的因時間問題也都沒一一實現,還包括它雖然我們用起來得心應手但是它的使用門檻還是有些高,和傳統繪畫相比,可能更需要後續的教學和引導,但這也沒關係,畢竟是在當今這個什麼都有可能的時代。

彩蛋:
獅子頭在這裡插入圖片描述

回眸1
在這裡插入圖片描述


  1. 在創作這幅作品時,使用了更多的網格節點。但是因為瀏覽器效能原因,導致繪畫有所延遲,所以為了良好的使用者體驗,最終選擇減少的畫板的網格節點數量來換取流暢度。 ↩︎