電商類APP的視覺設計制作

李晨

摘要：為了給電競愛好者提供專業(yè)且多元化的游戲外設服務，以APP的形式設計制作。通過針對性更加強的外設產品導購推薦，使用戶省去不知購買何種外設的煩惱；另外通過推薦不同版塊的外設資訊以及測評，來提升用戶的活躍度，最終打造一個專業(yè)的外設生態(tài)服務圈。其視覺設計制作效果最終以簡潔的色彩與便捷布局為主。根據(jù)市場調研，分析APP運營的環(huán)境，確認軟件功能需求劃分以及對于運營的數(shù)據(jù)分析和效益預測之后，設計工作主要包括了低保真、高保真的還原制作，來實現(xiàn)最終的APP視覺設計。

關鍵詞：低保真；高保真；視覺設計

中圖分類號：F49 文獻標識碼：A 文章編號：1005-5312（2018）23-0041-01

隨著電競市場的不斷進步，國內熱愛電競游戲的玩家數(shù)量不計其數(shù)。因此，用戶對于游戲外設的需求也越來越高。而目前購買游戲外設一般的途徑是通過淘寶、京東這樣的電商平臺，但是此類平臺又缺乏相關的專業(yè)性服務，例如資訊，產品評測等。在這樣的背景下，電競玩家就需要有一款能夠為他們提供專業(yè)性、多元化服務的游戲外設APP，滿足不同玩家對游戲外設的不同需求

一、應用制作的設計理念

1.應用目標以及運行環(huán)境。在此類電商APP系統(tǒng)建設中，將注重網(wǎng)絡平臺、應用體系、數(shù)據(jù)庫體系和安全體系的規(guī)劃和建設，實現(xiàn)在IOS系統(tǒng)中可以正常運行；體現(xiàn)在游戲外設商品展示、咨詢發(fā)布，完善數(shù)據(jù)管理系統(tǒng)主要體現(xiàn)在游戲外設商品數(shù)據(jù)和外設咨詢信息的及時更新、以及用戶評論數(shù)據(jù)的更新。重點維護APP的安全性，如：用戶管理和模塊管理。最終目標對于用戶能夠方便、快捷、安全、可靠、及時、準確的收集。對于APP可具備安全體系標準統(tǒng)一、適應需求、切實可行的網(wǎng)絡安全保障體系。

2.應用主要功能的設計成型。通過制作問卷調查，對特定人群和游戲玩家的一類人群針對性的發(fā)放紙質型調查問卷。也通過市場調研得到的數(shù)據(jù)結果進行數(shù)據(jù)分析，對于數(shù)據(jù)的篩選及分析之后，得到類于超過六成的人考慮購買或者已經購買過中端以上的游戲外設裝備；產品評測以及專業(yè)資訊是用戶最希望具備的功能等這樣的分析得到這樣的分析結論。

由此將APP的功能模塊劃分為商品推薦和咨詢功能。商品推薦模塊主要內容是游戲外設商品的陳列以及導購功能的入口。在推薦模塊中，會根據(jù)不同的分類陳列商品，譬如熱門、耳機、鍵盤、手柄、鼠標等一系列的細化分類，從而讓用戶能夠更加清晰與快捷的找到自己想要的商品。同時也能夠在用戶沒有目的性的購買時起到商品推薦的作用。在資訊功能模塊中，根據(jù)不同的外設資訊種類與品牌分類從而設置了不同的外設資訊版塊譬如新品測評、外設資訊、游戲資訊、科技前沿等。這些都是便于不同玩家的不同設計分類。

作為電商APP，頁面設計上應用的購物車功能保持在界面的右上角，方便用戶進行查看、整合、購買。在進入商品詳情頁面之后，頁面的功能更注重于一鍵購買與商品分享。頂層的漂浮按鈕在滑動長界面的時候停留在底部，讓用戶不用滑動到界面頂端或者底端都可以隨時購買或分享商品。方便用戶的同時也是給用戶視覺上的一種便捷行為習慣。

二、交互設計的低保真與高保真制作

根據(jù)頁面規(guī)范，開始構建APP的低保真原型圖。在低保真的制作中，首頁一共放置了兩個一級界面推薦、資訊。登錄注冊頁面與普通的電商登錄注冊頁不同，此APP將登錄注冊兩個按鈕放在了同一個頁面當中，避免讓用戶在頁面跳轉之間迷失在頁面層級之中。在頁面中省去了第三方登錄按鈕其一原因是省去的了讓用戶選擇的時間，其二是獲取用戶信息保障應用的有效用戶量。

在應用的高保真制作上，根據(jù)應用的高保真設計規(guī)范，高保真按照低保真的標準進行模擬還原。在頁面設計上，分為三個部分：其一，在頁面色彩選擇上為了避免用戶的視覺疲勞感，使用大面積藏青色和白色為頁面的基本主調；其二，在導航的設計中，使用了90%的半透明，讓用戶整體瀏覽商品時的視覺感官得到順暢。在商品詳情頁延續(xù)了卡片設計，但采用了無陰影的手法，原因上商品信息內容增加，卡片數(shù)量也隨之增加，更小的卡片間距，去掉陰影后頁面的內容更加清爽易讀。同樣用字體的粗細拉開標題與描述文字的層級關系；其三，在界面布局上，卡片式的布局能夠讓用戶將推薦的商品信息更好的區(qū)分，更具有視覺沖擊力，同時也讓用戶有更大的觸控區(qū)域，更好的得到用戶體驗。同時也跳出來當今APP大肆使用扁平化設計給用戶帶來的扁平審美疲勞。

三、結語

設計電商類APP設計中色彩選擇上是更具有科技感的單色調讓整體界面呈現(xiàn)簡潔干凈的設計特征但同時不會讓用戶覺得單調。在制作中高保真按照低保真的標準進行模擬還原，設計出預想最終的視覺特點，為更多的游戲用戶帶來便捷、舒適的視覺設計效果。