很久沒來觀摩 Naver 的設計,剛好最近看到一篇關於穿戴式裝置 Apple Watch 的應用設計,所以想來學習學習。

Naver App for Apple Watch

這是一款結合天氣預報和 QR Code 實名制的小應用,因為疫情的關係,韓國有一陣子進入店家是需要掃 QR Code 實名制。他有幾點設計是讓我覺得不錯的:

  1. 卡片使用圓角,跟手錶的圓弧設計搭得很融洽。
  2. 因為手錶的可視範圍很小,所以利用多種不同的方式來表現卡片的內容,除了視覺效果外,還讓 user 知道能選取卡片觀看細節。不同的表現方式例如:卡片疊合、卡片間的小空隙、露出一小部分下張卡片等等。
  3. 他的互動體驗也非常流暢,包括天氣的動畫、展開卡片的方式等等。

下面依序 APP 的畫面,說明覺得設計不錯的地方。

首頁

首頁利用卡面疊合的方式,漂亮展示了兩張主要卡片: QR Code 和 天氣預報。天氣動畫的部分利用淡入+向左滑入+微放大,營造目前天氣的氣氛很順暢。

Naver App for Apple Watch

QR Code

點選 QR Code 卡片會有微縮小+向上展開卡片的互動,看起來非常清楚明瞭。

QR Code

天氣預報

進入天氣預報可以看到大張主卡片,下面會顯示一小塊綠色卡片的一點點,提示使用者可以向下滑取得更多資訊,我覺得這點設計很不錯,除了提示外還帶有設計感。下面三塊小卡片,分別利用小空隙展示天氣細塵紫外線等資訊。繼續滑會有未來 24H 的天氣預報,滑到最後還會自動回到一開始的大張主卡片,我覺得這是最貼心的一點!!因為手錶若要展示很長的內容,滑到最底後,勢必還是要有回最上方的方式,他直接做了卡片迴圈這點,讓我感覺很驚艷~(可能是我還沒看過太多手錶的 APP 吧 XD)

天氣預報

Reference