網(wǎng)易新聞奧運專題設(shè)計分享

隨著圣火點燃川尖,各大資訊平臺的奧運板塊已紛紛上線橡娄。今天就和大家分享一下網(wǎng)易新聞奧運專題幾個主要頁面的設(shè)計思路所刀。

網(wǎng)易新聞的奧運板塊分為3個部分:頭條看板探入、奧運助手和奧運專欄侵状。

看板


看板的設(shè)計目標(biāo)是讓用戶能快速獲取奧運簡要信息藏畅。綜合用戶需求并考慮項目的整體規(guī)劃需求蝙砌,看板樣式一致的基礎(chǔ)上随夸,內(nèi)容上區(qū)分了賽前和賽中兩種狀態(tài)靖避。布局上強調(diào)在固定空間內(nèi)信息能最大化外露潭枣。

賽前看板重點是奧運氛圍營造及功能預(yù)熱,所以信息主要是開幕式倒數(shù)計時筋蓖,奧運活動的相關(guān)入口卸耘。

賽中看板(如上圖)重點是將奧運進程中用戶最關(guān)心的信息清晰簡要的展示出來。經(jīng)過調(diào)研和對往屆用戶數(shù)據(jù)的分析粘咖,最終外露信息定為為奧運進程蚣抗、中國獎牌狀態(tài)和實時要聞。

看板高度在刻意控制之下,仍然占用了一條半新聞的高度翰铡,曾擔(dān)心占用空間太高钝域,可能會對不喜歡奧運的用戶造成閱讀影響,于是在可用性測試中加入了“折疊看板”功能锭魔。根據(jù)測試結(jié)果反饋例证,大部分用戶會忽略此操作,因為直接滑走看板比定位點擊一個小icon更加快捷迷捧。并且织咧,普遍用戶反饋,在奧運這樣的特殊期間漠秋,適量的奧運信息強推不會造成反感笙蒙。

奧運專欄

1.新聞主頁和奧運專欄的跳轉(zhuǎn)關(guān)系

如圖,點擊專欄入口則進入到奧運專欄內(nèi)庆锦,里面承載了有關(guān)奧運的全部內(nèi)容捅位。

最初在設(shè)計“奧運專欄”與“新聞主頁”之間來回切換的方案時,考慮到從功能結(jié)構(gòu)和形式上來說搂抒,奧運專欄相當(dāng)于是一套全新的內(nèi)容艇搀,嵌在網(wǎng)易新聞內(nèi),所以方案的關(guān)鍵詞是“切換”求晶,因此對應(yīng)專欄入口的位置焰雕,遵循一致性的原則,切換按鈕設(shè)計為常駐在A處誉帅。意外的是淀散,在可用性測試的過程中,85%的用戶在完成回到新聞頭條的任務(wù)過程中蚜锨,第一反應(yīng)是在左上角找返回.

分析結(jié)論:雖然我們在功能定位上認(rèn)為奧運專欄是一套獨立完整的系統(tǒng)档插,但對用戶認(rèn)知而言,僅僅只是進入了一個比較復(fù)雜的頁面而已亚再。并且郭膛,當(dāng)用戶在專欄內(nèi)進行了一系列閱讀操作之后,對于頁面結(jié)構(gòu)的認(rèn)知就會回到最基礎(chǔ)“返回/進入上一級”的狀態(tài)氛悬。因此會第一反應(yīng)在左上角尋找返回主頁的入口则剃,也就是最終采用的B位置方案。

2.項目訂閱

項目訂閱tab只展示用戶感興趣的項目相關(guān)新聞如捅。

對于訂閱流程上的設(shè)計棍现。曾考慮過,為了方便用戶镜遣,是不是可以先為用戶默認(rèn)選擇幾個熱門選項己肮,或者直接先為用戶展示熱門項目的相關(guān)新聞,只外露一個“編輯項目”的入口。但經(jīng)過對功能定位的分析后決定谎僻,用戶必須完全手動選擇感興趣的項目之后娄柳,再進入訂閱列表。因為如果主動幫用戶勾選艘绍,用戶很可能會直接跳過勾選這個步驟而直接進入新聞列表赤拒,這樣一來,和要聞里的新聞體現(xiàn)不出差別诱鞠,沒有達(dá)到個性化訂閱新聞的目的挎挖。

對于訂閱形式上的設(shè)計。由于功能結(jié)構(gòu)復(fù)雜航夺,為了節(jié)省開發(fā)和設(shè)計成本肋乍,設(shè)計中會盡量復(fù)用新聞客戶端內(nèi)部現(xiàn)有的樣式,因此整個奧運專欄的氛圍還是略顯嚴(yán)肅沉穩(wěn)敷存,所以在設(shè)計“項目訂閱”的形式時,想稍微活潑但不影響操作效率堪伍,最后采用了氣泡形式锚烦,將項目根據(jù)熱度區(qū)分為3種不同體量,便于點選帝雇。配合手勢感應(yīng)動效涮俄,增加靈動感。

奧運助手

在新聞主頁里尸闸,看板是跟隨頁面滑動的彻亲,在奧運專題里,獎牌榜吮廉、賽程等幾個重要入口也是跟隨頁面滾動的苞尝,因此,奧運助手作為一個固定入口常駐于頁面右下方宦芦。其中賽程和獎牌榜預(yù)計是用戶使用最頻繁的工具頁面宙址。

1.賽程

篩選賽程的維度有日期、決賽賽程调卑、中國賽程抡砂、項目賽程、精選推薦賽程恬涧。如果簡單粗暴的將這5個維度放入一個篩選器里注益,讓用戶每次到頁面都要進入篩選器一項一項的勾選,顯然效率很低溯捆。所以首先需要分組丑搔。

日期是相對宏觀的橫向篩選,中國賽程、決賽賽程低匙、各項目賽程是相對精確的縱向篩選旷痕。精選推薦賽程屬于人工編輯的更高一級精確篩選內(nèi)容。

橫向篩選:日期

里約和北京有11個小時的時差顽冶,正式賽程每天都基本集中在北京時間21點至次日9點之間欺抗,這意味著用戶會有頻繁的日期切換操作需求。因此最終采用日歷滑動或點擊的切換交互方式强重。

縱向篩選:精選賽程绞呈、中國賽程宣傳、決賽间景、各項目賽程

奧運會氛圍下佃声,一般用戶最關(guān)心的都是與中國相關(guān)的重要賽事,基于此倘要,中國賽程和決賽賽程也會是用戶頻繁使用的篩選操作圾亏。但僅以篩選的形式區(qū)分中國賽程和決賽還不夠直接和強化,所以增加精選賽程模塊作為補充封拧,在每天的賽程列表前增加一個單獨模塊志鹃,把當(dāng)天的重要賽程人工挑選出來,輔助用戶從上百條賽程信息中快速找到最關(guān)心的賽程泽西。除此之外曹铃,相關(guān)中國或決賽的賽程單條前增加了標(biāo)簽,使之更加醒目捧杉。

2.獎牌榜

獎牌榜在產(chǎn)品功能上考慮的非常全面陕见,所以對設(shè)計來說,重點不是把功能全部平鋪在用戶面前讓用戶選擇味抖,而是首先抽出最核心的功能评甜,為用戶設(shè)計一條查看獎牌信息的任務(wù)主線,并在用戶完成這條主線的路徑上仔涩,把更多擴展功能提供給用戶蜕着。

舉個例,如圖红柱,雖然頁面的主導(dǎo)航直接區(qū)分了獎牌榜承匣、中國榜、項目榜锤悄、個人榜韧骗,但設(shè)計的任務(wù)主線中,用戶進入獎牌榜后零聚,如果想看中國榜袍暴,主要路徑是通過榜單列表中高亮的中國獎牌單條信息些侍,點擊之后自動切換至中國榜。進入中國榜后政模,如果想查看各項目的獎牌情況岗宣,主路徑不是頂部導(dǎo)航,而是直接點擊列表中的項目淋样,切換到項目榜耗式。

整個奧運項目交互設(shè)計所承擔(dān)的任務(wù)包括初步的功能架構(gòu)設(shè)定,前期競品分析趁猴,以及具體方案的設(shè)計及不斷評估和優(yōu)化刊咳。過程中,受到實際開發(fā)成本和銷售需求的影響儡司,交互上多少做了一些妥協(xié)娱挨,這也是在大型活動類需求的設(shè)計中經(jīng)常會出現(xiàn)的情況〔度可用性測試也是設(shè)計過程中非常重要的環(huán)節(jié)跷坝,因為奧運專題的功能結(jié)構(gòu)比較復(fù)雜,且會影響用戶正常使用網(wǎng)易新聞的日常路徑習(xí)慣碉碉,因此探孝,可用性測試能讓我們對用戶反饋有所預(yù)估,且能準(zhǔn)確的感知用戶對待奧運信息時的行為偏向誉裆。

關(guān)于奧運的設(shè)計還有一些細(xì)節(jié)在本文中就不一一分析了,大家有興趣可以在網(wǎng)易新聞客戶端內(nèi)實際體驗一番缸濒,有任何問題和建議隨時反饋足丢,希望網(wǎng)易新聞陪你經(jīng)歷精彩的17天。

【中國庇配!加油斩跌!】

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市捞慌,隨后出現(xiàn)的幾起案子耀鸦,更是在濱河造成了極大的恐慌,老刑警劉巖啸澡,帶你破解...
    沈念sama閱讀 219,366評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件袖订,死亡現(xiàn)場離奇詭異,居然都是意外死亡嗅虏,警方通過查閱死者的電腦和手機洛姑,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,521評論 3 395
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來皮服,“玉大人楞艾,你說我怎么就攤上這事参咙。” “怎么了硫眯?”我有些...
    開封第一講書人閱讀 165,689評論 0 356
  • 文/不壞的土叔 我叫張陵蕴侧,是天一觀的道長。 經(jīng)常有香客問我两入,道長净宵,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,925評論 1 295
  • 正文 為了忘掉前任谆刨,我火速辦了婚禮塘娶,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘痊夭。我一直安慰自己刁岸,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 67,942評論 6 392
  • 文/花漫 我一把揭開白布她我。 她就那樣靜靜地躺著虹曙,像睡著了一般。 火紅的嫁衣襯著肌膚如雪番舆。 梳的紋絲不亂的頭發(fā)上酝碳,一...
    開封第一講書人閱讀 51,727評論 1 305
  • 那天,我揣著相機與錄音恨狈,去河邊找鬼疏哗。 笑死,一個胖子當(dāng)著我的面吹牛禾怠,可吹牛的內(nèi)容都是我干的返奉。 我是一名探鬼主播,決...
    沈念sama閱讀 40,447評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼吗氏,長吁一口氣:“原來是場噩夢啊……” “哼芽偏!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起弦讽,我...
    開封第一講書人閱讀 39,349評論 0 276
  • 序言:老撾萬榮一對情侶失蹤污尉,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后往产,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體被碗,經(jīng)...
    沈念sama閱讀 45,820評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,990評論 3 337
  • 正文 我和宋清朗相戀三年仿村,在試婚紗的時候發(fā)現(xiàn)自己被綠了蛮放。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,127評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡奠宜,死狀恐怖包颁,靈堂內(nèi)的尸體忽然破棺而出瞻想,到底是詐尸還是另有隱情,我是刑警寧澤娩嚼,帶...
    沈念sama閱讀 35,812評論 5 346
  • 正文 年R本政府宣布蘑险,位于F島的核電站,受9級特大地震影響岳悟,放射性物質(zhì)發(fā)生泄漏佃迄。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,471評論 3 331
  • 文/蒙蒙 一贵少、第九天 我趴在偏房一處隱蔽的房頂上張望呵俏。 院中可真熱鬧,春花似錦滔灶、人聲如沸普碎。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,017評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽麻车。三九已至,卻和暖如春斗这,著一層夾襖步出監(jiān)牢的瞬間动猬,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,142評論 1 272
  • 我被黑心中介騙來泰國打工表箭, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留赁咙,地道東北人。 一個月前我還...
    沈念sama閱讀 48,388評論 3 373
  • 正文 我出身青樓免钻,卻偏偏與公主長得像彼水,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子伯襟,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,066評論 2 355

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