中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

設計一款用于家庭理財的APP，幫助管理整個家庭的收入和支出。UI/UX 設計師 Ernest Asanov 和 Andrey Pixy 以及動效設計師 Kirill Erokhin 和 Andrey Pixy 在 藝術總監(jiān) Sergey Valiukh 的指導下，完成這次的設計。

本杰明·富蘭克林曾經說過：

“小心對待每筆支出吧，再巨大的郵輪也可能因為小漏洞而沉沒?！?/p>

對于絕大多數人而言，理財，管理生活中的每一筆支出，是一個長期存在的痛點，是老大難的問題。不過，隨著數字技術的發(fā)展，各種軟件和服務開始深入到我們生活的方方面面，許多曾經看起來麻煩無比的問題，都開始有了新的解決方案。就理財這件事情而言，設計師和開發(fā)者能夠幫并不專精于此的用戶，更好地掌控每筆資金的流向，并且更好地管理財務。

而這就是上周Tubik Studio的創(chuàng)意設計活動 UI Fridays 的主題：設計一款用于家庭理財的APP，幫助管理整個家庭的收入和支出。UI/UX 設計師 Ernest Asanov 和 Andrey Pixy 以及動效設計師 Kirill Erokhin 和 Andrey Pixy 在 藝術總監(jiān) Sergey Valiukh 的指導下，完成這次的設計。

任務

完成家庭理財APP的UI/UX設計，包含Web端和移動端兩個版本

設計過程

整個APP內的表述方式和微文案都采用了通用且易于理解的語匯，讓用戶可以更加輕松地管理日常的收入和支出，創(chuàng)建數據庫來跟蹤資金的流向和變化，提供全面的統(tǒng)計信息。這款應用擁有兩個不同的變體，web版和移動端APP。Web版擁有一個囊括大量信息的儀表盤，而移動端APP能夠更加直觀快速地處理各種信息。

設計師在經過討論之后，一致同意在兩個界面中都采用深色的背景色，這樣能讓數字和文本都具有較高的可讀性。

Web端儀表盤

Web端的儀表盤是用來承載信息的，它能夠在特定的時期針對數據進行分析和更為詳盡的展示。設計師之所以選擇深色的布局，是因為這樣可以創(chuàng)建出有著醒目細節(jié)和迷人布局的界面，吸引用戶關注到關鍵性的區(qū)域和重要的數據。

借助儀表盤，用戶對于收入、支出、特定周期內的統(tǒng)計數據一覽無遺。各種不同的數據使用卡片來承載，并且有效地組織到一個統(tǒng)一的布局之下。上面的界面展示了最近一周核心的統(tǒng)計數據，這些數據呈現了主要的財務狀況和相關的統(tǒng)計結果，右上角的菜單以標簽頁的形式顯示了不同時間周期選項，用戶可以對此進行自定義，默認情況下會顯示一周內的財務狀況。

儀表盤的卡片中，通常會顯示這些數據塊：

• 快速訪問菜單當中，承載著最受關注（Popular Categories）的支出類別
• 支出總額（Total Expenses）和交易頻率（Frequency of Transactions）
• 受關注的交易清單（Popular Transactions）
• 與上一個階段相比，每周平均消費偏好和屬性變化（Expenses and weekly average）
• 特定周期內收入和支出的線性走勢圖（Expenses and income）
• 用地圖標示出消費最頻繁的位置
• 基于財務狀況提供相應的建議（Recommendations）

另外一個值得一提的視覺設計細節(jié)，是設計師在設計財務的收支線性圖表的時候，采用了金融領域被廣泛認可的紅色和綠色來標識收支。除此之外，受關注的支出類別是可以被定義的，包括名稱和圖標，這樣可以強化整體的可導航性和交互的直觀性。

移動端 UI

移動端APP 的 UI設計是整個設計項目的另外一個重要組成部分。Web端的儀表盤雖然同時具備添加數據和展示和分析數據的功能，但是移動端APP在數據的添加和記錄上更加突出，移動端APP的設計目標就是讓用戶了解當前的狀況，并且在不同的環(huán)境下隨時隨地輕松地記錄收入和支出。

這個界面顯示的是最近的財務相關的操作，以圖標來區(qū)分類別。屏幕頂部顯示的是用戶的基本數據，當前界面顯示用戶當前是使用信用卡來支付。此外，你還可以通過垂直柱狀圖來快速預覽當天的收支狀況。如果需要針對特定的條目進行操作，用戶可以水平滑動觸發(fā)菜單，這當中會提供更多的交互選項。

右下角的漢堡圖標則能夠為用戶提供更為核心的操作與功能，無論你的移動端設備屏幕大小，這個菜單都非常容易觸發(fā)，也便于操作。移動端APP 還集成了重要通知和用戶建議，它位于頂部的個人信息條下方，為了區(qū)分不同類型的信息，通知條會以不同的顏色來顯示，例如橙色為警告，藍色為提醒。

針對列表中特定的條目，用戶可以滑動觸發(fā)菜單，進行編輯、分享或者刪除。

移動端界面的動畫顯示效果。漢堡圖標被觸發(fā)之后，彈出菜單以扇形顯示，承載三個主要的功能。

考慮到通知/建議需要吸引用戶的注意力，動效設計師為這一控件也加入了符合特征的脈沖式特效，用戶可以通過左右滑動來消除新提醒。

這個設計項目是Tubik Studio團隊探索理財相關的專業(yè)領域的一次試水，雖然是概念設計，但是在設計過程中是盡力遵循實際的用戶需求來進行的。

（題圖由作者提供）

原文作者：Tubik Studio

原文地址：uxplanet

譯者：@陳子木

譯文地址：優(yōu)設網

本文由 @陳子木?授權發(fā)布于人人都是產品經理，未經作者許可，禁止轉載。