• 新聞

    產品案例|為移動端填字游戲設計 UI

    字號+ 作者:采集俠 來源:網絡整理 2018-05-21 12:39 我要評論( )

    產品案例|為移動端填字游戲設計 UI

    現如今許多游戲已經不單只具有娛樂性,還具備了不錯的教育性和學習性。和之前的賽車游戲 UI 界面設計不同,這次我們要設計的游戲 UI,需要在娛樂性和教育性之間,找到平衡點,這款游戲是填字游戲 Letter Bounce 。

     產品案例|為移動端填字游戲設計 UI

    項目說明

    為移動端填字游戲設計 UI 和相應的圖形化元素。

    設計過程

    這一次給我們團隊的任務,是為這款移動端的手機游戲創建一個充滿趣味的游戲界面,考慮到它是一款教育類的游戲,需要兼顧到有趣和協調,教育性和游戲性。確保簡單有趣的同時,又不能完全沒有游戲本身應有的緊迫感。

    就功能而言,玩家需要根據提供的信息來填寫單詞缺失的字母,解決謎題。這個游戲是傳統的填字游戲的數字版,每個關卡都會有一組需要填寫的單詞,同時還會提供相應的解謎線索。這款游戲還具備社交屬性:玩家可以鏈接到 Facebook,分享分數,和好友競爭。漂亮的設計和動效被認為是留住用戶的核心功能之一。

    首先,我們來看看游戲的主屏幕。首先要考慮的是用戶在填寫字母過程中交互的過程。屏幕的上半部分顯示了用戶游戲中的關鍵參數,包括里程碑、成就、金幣和等級等參數。游戲界面的背景采用了漂亮的漸變,在亮度上,并沒有設置得很高,不會分散用戶的注意力。有待用戶填補的拼字網格被放置在屏幕的上半部分,還未被填寫的字母使用的是白色底;而提供給用戶用來填寫的字母在底部,這部分字母采用的是黃色底。這種色彩上的差異對于用戶而言很好分辨,底部的漢堡圖標為用戶提供了不同的選擇,而對側的燈泡圖標則是提示系統。整個布局當中,所有的元素都采用了平滑的曲線,或者圓角,這樣的設計讓整個界面不會顯得太嚴肅。

     產品案例|為移動端填字游戲設計 UI

    這一屏則是為用戶展示游戲要如何交互的教程,而為了達成目標,設計師需要盡量清晰地為用戶展示導航和交互。為了確保趣味性,字母被設計成為吉祥物,而動畫的加入,則避免了不必要的操作,讓用戶無需點擊就能明白如何操作。

     產品案例|為移動端填字游戲設計 UI

    在 UI 設計流程當中,設計師提供了多種漸變配色,確保了明亮多彩的配色足夠營造出有趣的氛圍。

     產品案例|為移動端填字游戲設計 UI

    值得一提的是,提示按鈕中所搭配的動畫。它模擬了光影波動的效果,能夠吸引用戶的注意力。而左下角的金幣數則告訴用戶,用多少金幣數可以獲得這一提示。

     產品案例|為移動端填字游戲設計 UI

    此外,游戲界面中還有許多界面是以彈出窗口的形式呈現出來的,用來告知用戶成就相關的信息和更新的內容,甚至還可以提供一些優惠。你可以在下面看到相關的范例:第一屏的彈出窗口展示的是用戶成就、當前關卡總分、獎勵、排行榜和 Facebook 分享以及繼續游戲的相關選項。隨后的幾個彈出式界面當中,設計師都沿用了相同的圓形按鈕和類似風格的元素,保持了整體視覺上的一致性。第二屏提供的是獲取金幣的途徑,第三屏則是設置。

     產品案例|為移動端填字游戲設計 UI

    關卡地圖是移動端游戲中重要的組成部分。在 Letter Bounce 當中,設計師將各種有趣的風景和游戲關卡結合到了一起,從雪山到火山,一應俱全。平面設計師 Denys Boldyriev 制作了各種有趣的平面插畫,生動,活潑。

     產品案例|為移動端填字游戲設計 UI

    除此之外,這款游戲的吉祥物也是非常關鍵的元素。我們最初在構思吉祥物的時候,決定使用字母按鍵來設計,為了讓它看起來更加人性化,我們為它加上了手和腳,在游戲中可以作出各種各樣的姿勢,在教程和 UI 界面中不同的位置和用戶進行交互。吉祥物作為游戲中一個頗為有趣的元素,具有強大的情感吸引力,為產品增加積極的情緒。

     產品案例|為移動端填字游戲設計 UI

    目前,這款游戲在 AppStore 和 Google Play 上都有上架,如果你想動動腦子,不妨去下載看看。

     產品案例|為移動端填字游戲設計 UI

    轉載請注明出處。

    1.本站遵循行業規范,任何轉載的稿件都會明確標注作者和來源;2.本站的原創文章,請轉載時務必注明文章作者和來源,不尊重原創的行為我們將追究責任;3.作者投稿可能會經我們編輯修改或補充。

    相關文章
    •  育碧憋大招,這游戲發行得狂賺!

      育碧憋大招,這游戲發行得狂賺!

      2018-05-21 12:39

    •  網易游戲520發布會多款新游不了解一下嗎?

      網易游戲520發布會多款新游不了解一下嗎?

      2018-05-21 12:39

    •  玩游戲噴這香水能變帥變強?Newbee推出香水令玩家瘋狂

      玩游戲噴這香水能變帥變強?Newbee推出香水令玩家

      2018-05-21 12:39

    •  OVIVO-開局一個小黑點,玩轉黑白兩道,這款游戲帶你體驗心跳的感覺

      OVIVO-開局一個小黑點,玩轉黑白兩道,這款游戲帶

      2018-05-21 12:38

    11选5下期推算方法