iT邦幫忙

2021 iThome 鐵人賽

DAY 7
0
自我挑戰組

30 天重新設計印度氣象局官網首頁系列 第 7

Day 7 重新設計資訊架構 (IA面)

兩天前剛接了一個大案,剛好又忙鐵人賽,真是整死人...
可能字也有點懶的打,大家看圖吧嗚嗚嗚


忘記補充一下,這次 redesign 主要所改變的階層,主要為資訊架構以上,直至視覺設計,所以我會盡量避開改變功能,畫面上有的選項盡力地保留。

在工作中的 redesign 很常會遇到這種狀況,有些設計師認為很多餘或根本不需要的選項和功能,客戶會十分堅持要保留(幾乎沒有那種可以大手大腳動作的重新設計,有遇到是謝天謝地)。

所以設計師們會退而求其次,不重要或次要的選項在無法刪除的情況下,會用選單或其他格局、色彩配置將他們藏起來。

資訊架構層(IA)

在進行著手設計印度氣象局官網之前,我會將資訊結構理清楚,通常會用 Evernote或相關筆記軟體寫出底下的架構。

這些架構通常蠻零散,細節不會花時間刻的非常的清晰,但可以提供我一個有用的指引來進行設計草圖。

原則:
儘量不要刪減原有頁面的資訊,有技巧的藏起一些對 TA 來說不必要的資訊,比如說我會選擇將出版(publications)還有新聞稿 (press release) 藏起來。

各區塊所做的改變

資訊架構我做的改變簡單解釋一下:

Topbar

盡量乾淨,留下about、語言等等比較跟個人資訊有關的

navbar (user)

因為導覽列資訊有點過多了,所以我打算把它分成 nav–民眾在意的資訊 ,另外一個是 sidebar–比較少用的資訊

何謂少用資訊?
比如說部門網站、關於IMD、一些以PDF呈現的資訊、還有 services ,比較過各國氣象局網站後,這些資訊我判斷是相對少用的。
(但因為沒有很嚴謹的使用者研究,所以這些其實大多是臆測><)

sidebar 側邊欄 (other info)

至於其他的部門網站似乎用處不太大,比較像是各州的訊息發佈來源,主要天氣在 IMD 首頁是看得到的,所以我也會將它放進比較不重要的側邊欄中。

main map

中間的大地圖和常用的天氣 icon 清楚的顯示出資訊,我會將警告放在上方,右邊可以觀看城市天氣細節,而天氣預報影片經考慮過後會放在下方。

cities forcast:

時間軸可以選擇想要觀看的天氣預報日期。
大城市天氣預報:我會將它往上提,使用者可以即時去看到其他城市的天氣。

news section

新聞我會選擇將它放在比較後面的位置。

footer

最底下我會放比較少用到的產品、天氣預報查詢系統、和其他拉拉雜雜的連結,我會選擇將四個產品手機APP聯絡資訊和相關網站都放在這裡。

為何我要這樣設計?

我覺得設計的原因,比起美感還重要。

首先,民眾會傾向直接看到自己所屬地區的資訊,所以我會將天氣概況放在互動式地圖中的導覽列。

主要的地圖部分要呈現的資訊,最重要的是溫度和降雨機率,風向其它可能就比較偏其次。

底下我會選擇放各大縣市的天氣,更底下才會放新聞和天氣預報的影片。主要是新聞和影片是輔助的作用,亦即它提供更多的資訊,上面的互動式地圖已經擁有基本的必要資訊。

至於各大縣市天氣,對於親友在外地或是想觀察颱風或梅雨來臨時整體狀況的使用者,可能會更重要一點。所以我會傾向把它放在上面。(事實上大部分國家的縣市天氣都是放在上面的位置)

資訊架構可以寫的非常的謹慎複雜,也可以像這樣簡單的畫個樹狀結構就好(我懶),下一篇終於可以來畫草稿了~


上一篇
Day 6 一樣的風格,不一樣的體驗 - 澳洲跟印度 氣象局官網分析
下一篇
Day 8 紙上原型 dirty prototype
系列文
30 天重新設計印度氣象局官網首頁22
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言