淘寶設(shè)計師關(guān)于紅包的設(shè)計實戰(zhàn)思考

創(chuàng)想者學院校慶優(yōu)惠

搶紅包成為每年大促活動的標配套餐,用戶對基本的紅包玩法都不陌生,各大電商也都在想方設(shè)法想通過紅包強化互動社交的聯(lián)系庭惜,支付寶的口令紅包悬槽,猜紅包,接龍紅包影斑,搶紅包给赞,親親紅包玩法設(shè)計百花齊放!怎樣讓玩家保持新鮮感矫户,又能搶得過癮片迅,同時又能達到引導搜索進店的最終效果。這是今年負責紅包項目的難點所在皆辽。

設(shè)計核心

o??? 體現(xiàn)符合今年全球化主題氛圍柑蛇,會在一些功能性頁面營造更多節(jié)日氣氛。

o??? 著重營造抽中紅包和分享紅包的場景驱闷,達成品牌影響力和傳播力唯蝶,向用戶傳達品牌的精神態(tài)度

o??? 通過簡化流程和玩法設(shè)計,統(tǒng)一的結(jié)果反饋遗嗽,使產(chǎn)品認知簡單

o??? 對紅包人物形象的探索粘我,紅包互動的更新穎的表現(xiàn)方式

針對每個階段諸多不同玩法的紅包,既要凸顯每個玩法的特色痹换,視覺過度上不可跨度太大征字,又需要有相對統(tǒng)一的感知體驗,創(chuàng)造一個熟悉又愉悅的體驗娇豫。

首先匙姜,在設(shè)計上需要運用符合品牌氣質(zhì)的視覺語言,讓用戶對品牌留下深刻印象冯痢。通過玩法的設(shè)計和情緒渲染氮昧,讓品牌在游戲中得到成功傳播框杜。

其次,一致的認知:統(tǒng)一紅包的基礎(chǔ)樣式袖肥,第二咪辱、統(tǒng)一結(jié)果彈窗等一些反饋頁面,這樣用戶在同時切換玩幾組紅包游戲中椎组,也易于理解油狂,便于分享出去后統(tǒng)一的認知,看到類似這樣的紅包界面就知道是淘寶的紅包活動寸癌。

雙十一紅包形象前期探索

十二國紅包小人形象(因為后續(xù)采用了告白小人的形象专筷,此部分沒有在項目中具體應用,項目結(jié)束后又做了一些深化)

腦袋上頂著金幣的紅包人蒸苇,從著裝配飾體現(xiàn)不同國家的特點和性格磷蛹。

主打風格:萌蠢、可愛風溪烤,扁平的幾何表現(xiàn)弦聂,明快的配色

限制: 整體形象比較規(guī)整,肢體動作不太好表現(xiàn) 氛什,擺在一起時會略顯呆板莺葫!

每個紅包小人都配有一套國家形象的服飾,比如結(jié)合中國特有元素的舞獅造型枪眉,新西蘭的毛利人的羽毛以及彩繪裝扮捺檬,思密達的韓服大蓬裙,美國牛仔贸铜,英國皇家衛(wèi)隊的熊皮帽和紅色制服堡纬,日本的和服壽司,表情萌呆蒿秦,國際形象突出烤镐,營造一群陽光歡樂的紅包人物形象。

為了解決單一形象呆板單調(diào)的問題棍鳖,把形象做了更豐富衍生設(shè)計炮叶,配合了有趣的場景插圖設(shè)計的郵票,讓規(guī)則的紅包造型更加生動渡处。和服小妹趴在壽司上镜悉,毛利人的航海購物之旅,結(jié)合標志性的國家建筑場景医瘫,簡潔的提煉標志元素侣肄,運用情感化的圖形語言讓頁面更具有親和力!

雙十一互動紅包設(shè)計

密令紅包拼得不只是手氣醇份,是機智稼锅,記憶力吼具,速度,還有最重要的國語水平矩距!

搜索框被玩壞了拗盒!通過“文字密令+圖片”的紅包模式,普通用戶玩起了文字迷剩晴、大秀恩愛…商家更可以利用口令達到傳播品牌的效果锣咒。所以在設(shè)計中所有都要以密令為主核心做強化侵状,分享頁面通過搜索框的來示意密令的玩法路徑赞弥,并用更跳躍的黃色做引導。

我們堅持經(jīng)典的活動配色:紅黃搭配趣兄,過節(jié)不累~

在配色上還是以經(jīng)典的番茄雞蛋的配色绽左,還運用了一些夜空絢爛煙花的色調(diào)襯托,渲染夜晚狂歡的熱鬧艇潭。場景豐富上也做了更多的細節(jié)嘗試拼窥。比如設(shè)計了一些告白小人舞動四肢慶祝的場景,結(jié)合國家的建筑元素體現(xiàn)全球化狂歡主題蹋凝。

故事梗概:在2015雙11即將來臨之際鲁纠,浩瀚的宇宙夜空,有一個即將熱烈迸發(fā)的紅包星球鳍寂,來自世界各地伙伴共同慶祝雙11狂歡得到來改含,紅包君們已經(jīng)秘密潛伏在他們中間,只要輸入暗號口令就能開啟島嶼之門迄汛。我發(fā)密令捍壤,你拿紅包!這是今年正對前幾年支付寶口令紅包的升級玩法~

這次雙11紅包以貓頭為統(tǒng)一的頭像標識鞍爱,背后透出一些金幣表現(xiàn)表現(xiàn)紅包的分量感鹃觉。密令紅包分為:商家、明星和c2c 的紅包睹逃,設(shè)計統(tǒng)一的信息展示結(jié)構(gòu)盗扇,商家和明星紅包則可自定義更換封面海報,提供更大的表現(xiàn)空間沉填,商家則可以設(shè)計更多商品和活動的營銷透出粱玲。

紅包插圖設(shè)計

作用:營造氛圍、雙11元素的透出和傳播~ 如貓頭和國家元素拜轨。

插圖狂歡氛圍的營造讓整個偏功能主導的紅包產(chǎn)品 有了更多節(jié)日的渲染抽减,全球化的理念幾乎貫穿在整個雙11活動各個產(chǎn)品中,繪制的藍色地球上橄碾,乘著天貓?zhí)柕拇L和世界各地的伙伴一起舉杯慶祝卵沉,夜空煙花綻放颠锉,清新柔和的藍灰色調(diào),搭配主體紅色的氛圍史汗,也不會影響主體信息的理解和操作琼掠。

雙十二紅包爭奪戰(zhàn)

設(shè)計核心:

o??? 每環(huán)的商家星球的主體設(shè)計,表現(xiàn)方式:輕質(zhì)感表現(xiàn)停撞,星球的縱深空間感瓷蛙,有趣的形象和細節(jié)設(shè)計是重點!

o??? 搶奪紅包的格斗動態(tài)展現(xiàn)戈毒,突出緊張迫切的氛圍艰猬,強化引導點擊。

o??? 有趣的是你來我往互偷的爽勁埋市,通過設(shè)計的情緒引導冠桃,調(diào)動玩家的熱情和新鮮感!

氛圍營造:

1.??? 1-3環(huán)商家主題星球的設(shè)計(圖一)道宅,帶有一些爭戰(zhàn)元素的星球通過可愛的元素表現(xiàn)食听,小怪獸、糖果污茵、動物等中性柔性主題樱报,讓女生也能接受打斗戰(zhàn)爭的氣氛。

2.??? 打斗的動態(tài)反饋是讓搶紅包很過癮的體驗泞当,隨著紅包不斷飛出迹蛤,視覺體驗上更加立體,唯一不足的是當用戶在熟悉了玩法后零蓉,不斷打斗的狀態(tài)會造成用戶一些疲憊感笤受,持續(xù)的雷同頁面會使一部分用戶失去新鮮感,越是簡單的游戲敌蜂,激勵設(shè)計和如何保證新鮮感尤為重要箩兽。如這個打斗頁面(圖二)可以通過設(shè)置穿著不同戰(zhàn)服的士兵形象、武器來獲得用戶的持續(xù)關(guān)注章喉。

3.??? 通過首頁底部的黃色月球設(shè)計串聯(lián)3個入口的界面導航作用汗贫,同時也非常契合星戰(zhàn)的主題氛圍,同時這里的月球又和搶奪頁面的月球形成呼應的作用秸脱,增加用戶在前后的操作中的連貫感知落包。

星球戰(zhàn)爭主題icon設(shè)計

50個星球,依照商家出現(xiàn)的屏數(shù)1-3環(huán)的招商設(shè)置摊唇,設(shè)計分屏主題化咐蝇,激發(fā)用戶再瀏覽過程的好奇心,(探索更多主題的星球)巷查,緩解因出現(xiàn)屏次靠后的商家的訪問量的遞減的情況有序。

星球的形象討得用戶喜愛:星球飛船抹腿、小怪獸、萌寵和糖果水果主題旭寿,形象上更偏萌系卡通風格警绩。輕質(zhì)感得表現(xiàn)方式,利用自然得漸變過度和柔和的投影保證星球的空間三維感盅称。

紅包項目設(shè)計過程中的一些手繪構(gòu)思草圖肩祥,幫助快速表現(xiàn)腦海中的想法,搭建頁面構(gòu)圖和布局缩膝,有了第一步構(gòu)思草圖便可以進行小組的討論混狠,快速敲定最終方向,如果方案不行也可快速更新思路探索新的方向逞盆,手繪草圖在前期的設(shè)計過程非常高效檀蹋∷缮辏快速表現(xiàn)腦海中閃現(xiàn)的創(chuàng)意云芦,也更好得理解產(chǎn)品的設(shè)計目標,提前預知問題的風險贸桶,在項目結(jié)束后也方便自己的總結(jié)和回顧舅逸。

小結(jié)

任何一個產(chǎn)品都需要經(jīng)過不斷的打磨,才能慢慢得更接近你心中的樣子皇筛,可能一開始有很多不完美的細節(jié)琉历,沒關(guān)系,在持續(xù)地探索慢慢得雕琢之后水醋,你會慢慢觸到方向旗笔。很多時候平時的思考的和技能上的積累很重要,在雙11雙12這樣時間有限需高產(chǎn)出的項目中拄踪,會遇到很多新的挑戰(zhàn)蝇恶,在短時間內(nèi)產(chǎn)出不同階段的設(shè)計方案,對設(shè)計方法和技能尚有比較高的要求惶桐,同時也是最能體現(xiàn)設(shè)計綜合能力的時機撮弧,會碰到很多平時平時不太接觸的問題,用最快的時間查閱資料姚糊,快速學習和高效的執(zhí)行力會使項目有序得進行贿衍,不斷的驗證和實踐是最好的方法。

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?【特色推薦】

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 想在地鐵上救恨、被窩里獲取設(shè)計教程贸辈、經(jīng)驗分享和各種意想不到的”福利”嗎?

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?添加微信號:sz-chuangxiangzhe

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?微信公眾帳號搜索:創(chuàng)想者

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 官方微博:創(chuàng)想者

UI設(shè)計 網(wǎng)頁設(shè)計 ?UI設(shè)計培訓? 網(wǎng)頁設(shè)計培訓 深圳UI設(shè)計培訓? 深圳網(wǎng)頁 設(shè)計培訓 UI設(shè)計培訓學校?哪家UI設(shè)計機構(gòu)好?最好的UI設(shè)計培訓機構(gòu)?UI設(shè)計學習?遠程UI設(shè)計培訓?UI培訓?UI培訓機構(gòu)?UI培訓學校?深圳最好的UI培訓機構(gòu)?UI培訓機構(gòu)有哪些? 網(wǎng)頁設(shè)計培訓有哪些IOS界面切圖 界面設(shè)計切圖 創(chuàng)新設(shè)計 創(chuàng)意設(shè)計 創(chuàng)新思維 最專注UI設(shè)計培訓的機構(gòu)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末肠槽,一起剝皮案震驚了整個濱河市擎淤,隨后出現(xiàn)的幾起案子躏哩,更是在濱河造成了極大的恐慌,老刑警劉巖揉燃,帶你破解...
    沈念sama閱讀 210,914評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件扫尺,死亡現(xiàn)場離奇詭異,居然都是意外死亡炊汤,警方通過查閱死者的電腦和手機正驻,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,935評論 2 383
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來抢腐,“玉大人姑曙,你說我怎么就攤上這事÷醣叮” “怎么了伤靠?”我有些...
    開封第一講書人閱讀 156,531評論 0 345
  • 文/不壞的土叔 我叫張陵,是天一觀的道長啼染。 經(jīng)常有香客問我宴合,道長,這世上最難降的妖魔是什么迹鹅? 我笑而不...
    開封第一講書人閱讀 56,309評論 1 282
  • 正文 為了忘掉前任卦洽,我火速辦了婚禮,結(jié)果婚禮上斜棚,老公的妹妹穿的比我還像新娘阀蒂。我一直安慰自己,他們只是感情好弟蚀,可當我...
    茶點故事閱讀 65,381評論 5 384
  • 文/花漫 我一把揭開白布蚤霞。 她就那樣靜靜地躺著,像睡著了一般义钉。 火紅的嫁衣襯著肌膚如雪昧绣。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,730評論 1 289
  • 那天断医,我揣著相機與錄音滞乙,去河邊找鬼。 笑死鉴嗤,一個胖子當著我的面吹牛斩启,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播醉锅,決...
    沈念sama閱讀 38,882評論 3 404
  • 文/蒼蘭香墨 我猛地睜開眼兔簇,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起垄琐,我...
    開封第一講書人閱讀 37,643評論 0 266
  • 序言:老撾萬榮一對情侶失蹤边酒,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后狸窘,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體墩朦,經(jīng)...
    沈念sama閱讀 44,095評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,448評論 2 325
  • 正文 我和宋清朗相戀三年翻擒,在試婚紗的時候發(fā)現(xiàn)自己被綠了氓涣。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,566評論 1 339
  • 序言:一個原本活蹦亂跳的男人離奇死亡陋气,死狀恐怖劳吠,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情巩趁,我是刑警寧澤痒玩,帶...
    沈念sama閱讀 34,253評論 4 328
  • 正文 年R本政府宣布,位于F島的核電站议慰,受9級特大地震影響蠢古,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜褒脯,卻給世界環(huán)境...
    茶點故事閱讀 39,829評論 3 312
  • 文/蒙蒙 一便瑟、第九天 我趴在偏房一處隱蔽的房頂上張望缆毁。 院中可真熱鬧番川,春花似錦、人聲如沸脊框。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,715評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽浇雹。三九已至沉御,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間昭灵,已是汗流浹背吠裆。 一陣腳步聲響...
    開封第一講書人閱讀 31,945評論 1 264
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留烂完,地道東北人试疙。 一個月前我還...
    沈念sama閱讀 46,248評論 2 360
  • 正文 我出身青樓,卻偏偏與公主長得像抠蚣,于是被迫代替她去往敵國和親祝旷。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 43,440評論 2 348

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 171,732評論 25 707
  • 翻開每天的word記錄,看了上周日寫的周計劃怀跛,行行列列距贷,依舊能記得當時敲鍵盤時的心情~沒時間了,等不及了吻谋,...
    ywp21閱讀 291評論 1 2
  • 在網(wǎng)上搜天文入門書籍的話忠蝗,有兩本書是會多次出現(xiàn)的:《夜觀星空》和《諾頓星圖手冊》。準確來說漓拾,這兩本是天文觀測和天文...
    陌隱moy閱讀 1,418評論 0 0
  • 五個表達 1.right 原句:Me and Rowley started running, but those ...
    daimosun閱讀 820評論 0 0