鑽石舞台

項目開展

近些日子，智行火車票客戶端正在準備全新的視覺升級。而作為這次升級的重要分支：UI品牌符號，承載了傳遞品牌感知，打造產品差異化的重要作用。

我們希望符號展現什麼?

1、體現此次改版的設計主題

2、突出有別於其他產品的品牌特點

3、加入更多的情感元素，讓改變更有趣

畢竟旅行的背後，是人們追求快樂生活的衝動。

1.確認關鍵詞

#02

設計處理

確認基礎形體之後，考慮品牌感知與實際場景應用，我們加入了更多的設計處理。

1. 形體處理

上下圓角的曲線：在形體細節的處理上，我們並沒有使用簡單的圓角倒角。而是參考現實中的火車，讓形體保持流暢的基礎上帶有一定的現實映射。

2. 色彩選擇

漸變色的選擇：以前的智行有自己的標誌性的藍色。然而為達成此次改版對「輕量化」與「年輕化」的目標，設計小組在先前「品牌色」的基調上增加了漸變規範

一抹更具有呼吸感的向淺色漸變，也同時賦予了符號動感與活潑。

3.賦予動勢

動感的強化：最後，考慮符號的應用場景以及對於「火車」意向更好的表達，符號在整體應用上會更多的使用「馳騁」「駛入」等富有速度感的動畫

具體的示例還請往下看設計應用部分~

#03

設計應用

1.首頁及一級頁面應用

首頁下拉動效與所有一級頁面

對於場景的考量，我們希望達到以下效果：

1、儘可能地露出，加深用戶印象

2、儘可能不影響頁面已有的層級，不刻意

3、結合巧妙，不生硬

那麼在曝光率最高的首頁與一級頁面。我們選擇了兩處合適場景，loading加載動畫，與頁面標題。前者增加等待的趣味性，後者總領頁面加強應用的辨識度。

除此之外，在類似登錄頁面等新客必經頁面中，我們也放大了品牌符號，用於加強新客感知。

2. 首頁底Bar圖標

重構菜單欄圖標，賦予更強的感知

關於底Bar圖標的設計，先前已經撰寫過相關文章。感興趣的可移步

👉Tab圖標這麼設計？一下擊中我的呃..心巴。

選中狀態使用統一的品牌符號。不再使用常規的各自形態的選中狀態，用來強化的符號感知，增強記憶點。

3. 常用頁面組件

將符號應用到頁面組件中

除去首頁等核心頁面的應用外。我們還希望將其適當應用在諸多普通頁面。於是，我們將UI品牌符號融入到了許多例如模塊標題，切圖tab等常見頁面組件

在輔助頁面信息傳遞的同時，增加曝光、強化感知。

4. 融入品牌字體

將符號融入品牌字體設計中

運營活動是品牌透傳的絕佳場景。藉此機會，我們將符號形體加入到品牌字體的設計之中，對先前的字體做了一次全面升級。

新的字型除了在大部分轉折處加入了一定的平滑處理外，最具體特點的將部分重要的的橫筆做了整個異形處理。保持整體性的同時也不失趣味性與記憶點。

#04

最後想說

智行火車票即將迎來全面的10.0版本升級，多年以來我們致力於打造更新的產品功能與更好的流程體驗。這次的UI品牌符號分享，只是一個開始，也希望大家能夠關注我們之後的故事。

願您的每次旅行都有智行相伴。

智行ZXD