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

本文作者與我們分享了一個案例，即：一個針對女性用戶的照片編輯軟件，要如何設計UI？enjoy~

照片是記錄生活的重要手段，在智能手機如此普及的今天，誰的手機里面又沒有幾百上千張照片呢？這些記錄關鍵時刻的圖片，對于每個拍攝者而言都是不可復制的珍貴瞬間。也正是因此，許多用戶對于攝影和照片的編輯美化處理，都有著無與倫比的熱情。今天的項目，是設計一個照片編輯 APP。

現在照片編輯類的 APP 用戶受眾非常廣泛，但是在整體比例當中，年輕人是主體，而年輕女性在其中的占比更大。在今天的這個設計案例當中，是由 Tubik Studio 的 UI 設計師 Tania Bashkatova 和平面設計師 Yaroslava?Yatsuba 所負責的。

任務簡述

移動端圖片編輯 APP 的 UI 和 UX?設計。

預處理流程

考慮到用戶最大的受眾是15~35歲之間的女性用戶，設計師將會針對這些用戶制作自拍和照片編輯 APP，目前這款 APP ?暫時定名為 Cuteen，而 Slogan 則定為「遇見最美麗的你」。

在針對這個 APP 進行 UX 設計的時候，需要滿足它最基本的六個特征，在風格上能夠保證現代化、年輕化、女性化、趣味化的 UI 設計。此外，我們團隊還決定創建一組自定義圖標用到 UI 當中，并且結合相對鮮艷的配色方案。

在開始動手設計之前，設計師針對用戶和市場進行了調研。這個階段搜集的信息能夠反映出用戶的期待，對于產品的設計非常有用。團隊基于研究成果進行頭腦風暴，設計師則將她的核心設計思想體現在整個 UX 設計方案和風格偏好上。

UX 設計

設計師的首要任務是將所有的功能以直觀的形式展現出來，確保每個用戶都能夠進行便捷的圖片編輯。為了使這個過程的效率更高，設計師先創建了線框圖來整理整個界面的信息架構。線框圖將會將屏幕的布局和可視化的元素視覺化的、快速地呈現出來，讓開發者和客戶都可以直觀地了解。

Cuteen 這個 APP 包含6個基本的功能，這些功能需要以最有效的方式呈現。設計師提供了兩種不同的布局方案。第一個方案當中，包含了頂部的圓形 Banner 和品牌名稱，設計師設計了包含基本功能的圖標和拍照按鈕的若干布局變種。其中拍照按鈕作為優先級最高的交互元素，它應該有行為召喚的特點，所以它和背景其他元素應該有著足夠的對比。

這種方案中的 UI 組件的布局方式有三種，第一個是將拍照按鈕和功能區分開，而另外兩種方案則盡量讓這個按鈕和功能區之間在視覺上產生關聯。

第二個方案則專注于功能的展示。Banner 被刪除了，圖標被放置在屏幕的頂端，作為 CTA 元素的拍照按鈕被置于中間。這種結構讓用戶更能夠集中注意力，減少可能存在的干擾，并且讓導航更加直觀。此外，設計師還增加了一個顯示最近流行效果的信息流，用戶可以無需篩選就能看到最新最流行的特效。

這兩個方案各有優劣，因此設計師決定在 UI 設計階段比較兩種布局方案的優劣。

UI 設計

UI 設計的主要策略是創造時尚和富有娛樂性的風格?？紤]到這款應用主要面對的是年輕的女性用戶，因此設計師決定采用明亮的配色方案搭配漸變的效果。而諸如拍照按鈕這樣的 CTA 元素則使用明亮的粉紅色。這樣的配色和美麗的設計策略，與女性用戶的氣質和偏好非常契合。

至于六個不同功能的圖標則使用六種對比色來呈現。通過這種方式，讓不同的功能和不同的色彩產生關聯，這樣一來，用戶在逐漸熟悉應用的過程中，可以在不用閱讀圖標標簽的前提下快速識別它們。此外，為了讓整個界面看起來更加舒適宜人，設計師使用了白色的背景，讓整個布局在視覺上更加平衡。

經過多次的探索之后，設計師選擇了第二個方案，也就是沒有 Banner 的這個方案。隨后設計師還開發出了上圖中的三個變體，作為默認的 UI 解決方案。這種結構讓交互區域更為明晰，而且邏輯清晰。另外，第二個方案內置了許多不同的風格樣式供用戶選擇，隨意切換。在這個版本的設計當中，用戶的注意力會集中在自定義的圖標上。

總而言之，Cuteen 的 UI 界面看起來是明亮而充滿活力的，有著直觀的交互系統，原創的信息流和自定義的圖標集。

自定義的圖標設計

原創的自定義圖標是這個 APP 的亮點之一。對于參與這個項目的平面設計師而言，是個有趣的挑戰。

為了節省時間來構思并完成作品，設計師選擇了手繪草圖。設計師提供了三套不同風格的圖標，并且為每個功能提供了各種各樣的概念設計。

最終，UI 設計師決定使用第二個設計方案之后，平面設計師將草圖重新繪制為數字化的圖標，所有的細節都得到了呈現，自定義圖標提升了整個 UI 界面的可識別性。另外，這些自定義圖標同樣支持自定義風格，這也使得整個設計顯得多樣而自由。

設計師制作了兩種不同風格的圖標，第一種的設計是為了兼容多彩的風格，它可以看起來更加明亮。而筆觸相對簡約的圖標則可以更好的兼容基本的布局。圖標的邊緣被設計得不閉合，這遵循的是格式塔原理，人會在視覺上補全。這樣的設計讓圖標顯得充滿活力而有趣。

總而言之，這些細小的細節會讓整個 APP 顯得強大而實用，設計人員應該關注每一個 UI 組件，包括圖標和按鈕。

原文作者 :?Tubik Studio

譯者/編輯 :?陳子木

譯文地址：https://www.uisdc.com/case-study-cuteen-uiux-design

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

題圖來自 Unsplash，基于 CC0 協議