羅麥隨行APP首頁改版交互設(shè)計和視覺設(shè)計

羅麥隨行APP首頁改版交互設(shè)計和視覺設(shè)計

交互設(shè)計 | 界面設(shè)計 | vue開發(fā)

交互設(shè)計 | 界面設(shè)計 | vue開發(fā)

羅麥隨行app,一個與羅麥伙伴無縫鏈接的平臺,這是一個讓羅麥伙伴足不出戶,也能隨時隨地了解羅麥事業(yè)的平臺。羅麥微生活、羅麥微視頻、羅麥隨身工具包、羅麥電子書、羅麥科技微聚焦等版塊統(tǒng)統(tǒng)搬回家。這個App已上線多年未更新,客戶希望設(shè)計公司自由發(fā)揮,在現(xiàn)有功能上優(yōu)化交互和視覺,完成首頁改版。

藍藍設(shè)計下載了這個軟件,查閱了相關(guān)競品:安利等公司的APP設(shè)計及國外的優(yōu)秀設(shè)計作品。作為一個使用者,仔細的研究了APP目前的功能特點,內(nèi)容更新頻率,按照產(chǎn)品運營的思維,重新梳理了交互設(shè)計、視覺設(shè)計。在基本沒有客戶參與的情況下,設(shè)計出首頁的提案。

產(chǎn)品定位

羅麥隨行——口袋里的多媒體工具包。
掌握公司動態(tài),一點知曉羅麥事;
多欄目、多類別,總有一款適合你;
微生活,為生活,多彩羅麥盡顯科技力量;
海量信息,智能捕捉,羅麥的多元展示之窗。

目標用戶

北京羅麥科技集團是一家集科研開發(fā)、生產(chǎn)運營、銷售服務(wù)于一體的多元化高新技術(shù)企業(yè),直銷企業(yè)。這款軟件致力于為廣大營銷人員和消費者提供優(yōu)質(zhì)的產(chǎn)品和卓越的服務(wù)。 通過線渠道購買羅麥產(chǎn)品。

設(shè)計風(fēng)格

設(shè)計風(fēng)格參考羅麥科技官網(wǎng)的logo色調(diào),綠色和紅色的結(jié)合,突出品牌的主題。在保持APP整體設(shè)計語言的一致的前提下;頁面布局按照我們的理解進行適當(dāng)?shù)膬?yōu)化,以更加貼近用戶使用場景。 整體設(shè)計簡約、優(yōu)雅、創(chuàng)新。

首頁界面設(shè)計

改版希望從不增加功能的情況下,對產(chǎn)品的功能、交互、視覺呈現(xiàn)進行重組和設(shè)計。我們重新梳理整個app現(xiàn)有的功能,改變原有首頁單調(diào)不美觀的現(xiàn)狀,在首頁增加了一些便于用戶操作和促進用戶購買的內(nèi)容。豐富首頁內(nèi)容,減少用戶操作,提升用戶體驗,目的是使App成為企業(yè)營銷、銷售的利器。

羅麥隨行APP首頁改版交互設(shè)計和視覺設(shè)計-首頁

遠東移動門戶-交互設(shè)計

頂部模塊--包括「搜索框」「消息入口」「banner」三個功能。搜索框能幫用戶快速定位想要的內(nèi)容提高易用性, banner展示主推產(chǎn)品促進用戶消費。
入口模塊--入口圖標簡化成四個,去掉「全景展示」和「麥享視聽」,「資訊」放到頁面下面的菜單,「麥享定制」分開突出展示。
整體依舊采用和logo主題色保持一致的設(shè)計語言進行設(shè)計,保證圖標的可讀性和示意性,準確表達出功能的含義。
消息通知--重要消息主動推給用戶。
「麥享定制」--分成兩個在首頁展示,用戶可快速進入到需要的頁面,減少操作。



直播提示--直播從下面菜單提上來作為一個單獨區(qū)域,更加直接的提高用戶的觀看興趣。






產(chǎn)品展示--「排行榜」「小編推薦」「好物推薦」這三個區(qū)域都是產(chǎn)品展示區(qū),將熱銷的、用戶需要的產(chǎn)品主動推給用戶,從而促進消費。






最新視頻—短視頻、直播引流是目前市場比較火熱的,所以在首頁有個單獨的展示區(qū)域,減少用戶操作步驟,同時在首頁默認展示四個,根據(jù)用戶的不同需求,如果想繼續(xù)看就點擊「加載更多」,如果不需要直接劃過繼續(xù)瀏覽下面內(nèi)容。





最新資訊—通過調(diào)研資訊更新的并不是很多,而且也不是app的主要功能,原app用大量空間展示并不合理。 所以將資訊模塊在保留的基礎(chǔ)上弱化。 菜單欄—通過線面結(jié)合的方式重新設(shè)計,顏色同樣采用綠色和紅色。菜單欄在保留原有內(nèi)容的基礎(chǔ)上增加了「資訊」。

羅麥隨行APP首頁改版交互設(shè)計和視覺設(shè)計
羅麥隨行APP首頁改版交互設(shè)計和視覺設(shè)計

方案二和原型較為接近,以視覺美化為主,整體在功能布局上沒有做太多的延伸。

Banner通過弧形巧妙的和主功能菜單聯(lián)系在一起,增加頁面的趣味性,使頁面更加活潑,banner在后,4個菜單在前,體現(xiàn)了兩個層次的空間感。

將頁面原來快捷入口的「麥享定制」和「直播」單獨提出來,引進用戶的關(guān)注和轉(zhuǎn)化率。

公司新聞分為大卡片的焦點新聞和列表類新聞。

大卡片的焦點新聞因為數(shù)量不多不會頻率更新,交互方式上改為橫向播動,以節(jié)省空間。

「資訊」放到頁面的下方菜單。



整體色調(diào)還沿用之前的紅色,暖色調(diào)可以激發(fā)用戶的購買欲,比如「淘寶」「京東」「拼多多」等熱門的購物軟件都是以暖色調(diào)為基礎(chǔ)。

  返回