直播是2020年到2021年移動互聯網的重要賽道，在以百度APP為核心的移動生態之下，缺少一個獨立的直播APP去承載整個百度直播體系和被直播所吸引的用戶。為了讓用戶“有出有進”，促成了這次的產品設計。
在這樣的產品孵化階段，我們希望產品在具有直播特性的同時，能夠與其他泛娛樂類的直播產品打開差異化，并且有足夠的記憶點讓它在眾多直播產品中被人們所記住并喜歡，那么品牌的塑造和品牌的融合就尤為重要。
所以，產品的設計圍繞著泛娛樂直播進行，進行功能的設計和梳理，其中視覺設計便以品牌為中心。
上述的內容，準備以上下兩篇文章來做闡述和展示。
這篇文章，主要以市場上的界面案例，來粗淺地聊聊品牌元素如何融入到界面設計中。
下一篇正在準備中，將以我剛來到百度時設計的一個獨立直播產品為例，盡可能完整地呈現以強化品牌、IP應用為核心的產品設計過程。
百度網盤
在網盤團隊去年的改版中，將積木的品牌概念，融入到icon的設計中，取得了巨大的成功和市場反響，蘇大牙的那篇復盤文章，一直在產品設計上影響著我的思路。
2.谷歌系APP圖標
谷歌如今統一了谷歌系產品的圖標風格，充分地在顏色和風格上體現了谷歌的品牌意識，如今我們一見到此類的圖標，第一反應便是，這是不是谷歌的APP？
3.映客直播
映客直播在啟動頁、tabbar，都把貓頭鷹的元素融入進來，在運營設計中，也更多的使用貓頭鷹剪影作為主體畫面的承載。
4.最右
最右在登錄相關的頁面，使用IP+品牌色的方式，強化品牌意識，在下拉刷新中，融入IP進行趣味性的設計，很好地詮釋了娛樂性、年輕化的產品應如何做情感化設計。
5.快手電丸
快手電丸在個人主頁默認圖、頭像默認圖、加載、頁面中的功能引導，都加入了IP形象強化品牌。
5.躺平
躺平是在我最近的產品體驗中，IP運用和品牌塑造最完整的產品，它成功的把“躺平”這個概念，應用到了IP形象上，再由IP形象對界面中的各處進行應用，延伸這個品牌概念。而且應用范圍并不僅僅局限于彈窗、啟動頁、刷新等常規IP應用點，更是在界面之中做到了自然合理的應用。
小結：
在界面設計中，對于品牌的強化，除了將品牌理念抽象化進行icon等圖形的設計，更多地產品喜歡采用具象的IP形象進行合理植入來進行品牌概念的傳達。
在IP的應用中，啟動頁、加載動畫、下拉刷新、彈窗裝飾、默認圖片等是常規的應用場景，除此之外，在卡片標題、功能入口、內容頁裝飾等地方出現IP的應用，更加能給用戶帶來驚喜感。
品牌在界面中的植入，在于小而有趣，而不在于多少，在合適和驚喜的地方出現，才能向用戶傳遞出情感。同時可以看出，在界面中應用的IP形象，基本不會出現3D化的情況，在年輕化、娛樂向的產品中，IP本身也沒有明顯的性別傾向。
總結下，無描邊、扁平、2D、無性別等特征，更加適合在界面中應用。少配色、輕漸變、結構簡單、應用場景尺寸越小，IP使用比例越小，這些原則也更有利于IP應用的合理性。
轉載請注明：站酷
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
Color是眼睛從光中感知到的感官印象，它以各種形式的概念和情感進行翻譯。對于藝術家來說，正確的操作非常重要，因此在整個歷史中，它已經以多種方式和不同的方法得到了理論化。
繪畫，印刷，攝影，圖形設計和界面設計使用色彩理論來喚起特定的思想和觀念，并利用色彩的非語言能力，而不是其他較慢的交流形式。
在界面設計中，從增強品牌知名度到在購買按鈕上產生更多點擊，色彩心理被用來影響用戶可能擁有的感知。其他重要結果，例如改進的可用性，也可以是良好的顏色掌握能力的結果。
在本文中，我將介紹設計界面時經常用于顏色選擇的六個注意事項。
特定的顏色與某些情感相關，但并非總是如此。自從我們出生以來，我們的眼睛就了解現實世界的色彩，隨著時間的流逝，記憶會將這些色彩與某些體驗和元素相關聯。這種熟悉程度可以為用戶提供有關界面目標的一些上下文。
當然，這不是絕對的，因為人類對現實的理解是非常不同的，并且不能以其所有形式進行概括。德國藝術家約瑟夫·阿爾伯斯在他有條不紊的書，彩色的互動，指出色的主強的特點就是相對論。西方國家的紅色可能代表著危險和邪惡，但在中國，紅色代表著幸福，歡樂和慶祝。盡管如此，他還指出，許多人以相同的方式感知某些顏色，例如與生態相關的綠色或粉紅色代表著女性氣質。
和諧的色彩使元素具有邏輯感。有很多方法可以創建色彩和聲。其中之一是通過使用類似的顏色，即在色輪中彼此接近的顏色。
為什么類似的顏色具有吸引力？因為這是自然產生的色彩行為。日落使天空從橙色變成紫色，海洋從藍色變成綠松石，彩虹將所有七種顏色融合在一起。我們可以得出結論，視線會以類似的顏色找到自然的愉悅感。
由于溫度也會產生相當大的協調性，因此建議僅在暖色或冷色之間保持此顏色范圍。還可以利用這些顏色的飽和度和亮度來創建類似物的使用深度。這完全取決于您要創建的效果以及界面顯示的內容。
色彩對比使界面更具動感。色彩補充的另一種形式是通過使用補色來實現的，補色是在色輪中彼此面對的補色。通過使用互補色元素，可以在設計中產生對比和動態效果。
對比顏色的好處包括，可以賦予界面能量和運動效果，以及增強一些我們希望用戶注意的相關點。要使這些顏色和諧相處并不容易，因為它們的濫用會造成視覺混亂，并使眼睛不適。比例是關鍵。
要了解有關色彩對比的更多信息，我推薦瑞士人Johannes Itten撰寫的《色彩的藝術》一書，其中介紹了七種對比類型的理論：色調，溫度，明暗，互補，飽和度，同時和定量。無論我們選擇哪種顏色對比，都應在整個Web /應用頁面中進行維護，以確保設計的一致性。
色階可減輕認知負擔。保持色調，但將閃電修改為不同的水平有助于分離元素，而不會使組合物過載。
UI設計中的色階也受自然影響，不僅受樹木葉子，天空或海洋等元素的影響，而且受物體和陰影的影響。人眼會感覺到相同顏色的許多變化，具體取決于照明，深度甚至紋理。人們期望UI顏色像他們在現實世界中一樣就不足為奇了。
可以說，使用色標的目的是避免添加大腦必須處理和不必要理解的新顏色或色調。界面設計越容易理解和越快，它將為用戶帶來更多的樂趣。
定義顏色比例可平衡組成。越來越多地使用顏色可以使樣式更清晰，并避免不必要的顏色沖突。
顏色層次結構對于定義一種氛圍非常重要，同時，它也是構成網絡中所有元素的主要色彩。在當前的UI設計趨勢中，白色是最受歡迎的顏色，因為白色可以保持界面干凈，突出顯示交互顏色并提高可讀性。但是，如果要在特定頁面上創建更具沉浸感和藝術感的效果，則選擇更飽和的顏色確實會很好。
交互顏色在執行過程中必須清晰且在界面中保持一致。號召性用語必須相對于背景具有足夠的對比度，并且相對于其他組件必須具有足夠的視覺重量，以便用戶可以輕松識別它們。
但是，交互色并不總是以最飽和或最亮為特征，而是以其色調，形狀，大小或對比度在屏幕上與其他元素脫穎而出。因此，交互顏色的有效性將通過用戶識別交互區域并以較少的思想執行任務的速度來衡量。
另一方面，次要行動號召力更輕，并且在視覺上更接近信息元素。在我們的耐克應用示例中，配置和聲音按鈕指示這些是交互作用，原因是形狀而不是顏色。按鈕的這種層次結構很重要，因此用戶可以對元素進行自然排序，并避免在每個屏幕上使用多個主要的號召性用語的不良做法。
總之，顏色是事物的重要影響者，它影響事物對環境的感知，并直接影響其他顏色甚至自身。盡管對其理論的深入研究可以改善我們對設計的掌握，但是創建專業配色方案的過程很大程度上取決于我們的視覺體驗和對現實世界的感知。讓我們開始訓練我們的眼睛。
轉載請注明：站酷
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
情感化設計在我們的決策過程中起著至關重要的作用，因為加入情感化的設計可以改變與產品交互的人的整體現實。
人類是一種情緒驅動的物種，我們選擇某些產品并不是因為它們有意義，而是因為我們認為它們會讓我們感受到不一樣的感覺。也正因如此，在未來的界面將在產品設計的基礎上使用情感的概念，人們使用的經驗將基于智商（IQ）和情商（EQ）。
本文試圖展望未來，看看我們將在未來十年內設計哪些接口。我們將仔細研究三種情感化界面設計的互動：
語音
增強現實（AR）
虛擬現實（VR）
未來情感化界面的實際例子
界面如何？即使我們還沒有回答這個問題，我們也可以討論接口可能具有哪些特性。在我看來，我確信我們最終將擺脫充滿菜單，面板，按鈕的接口，并轉向更“自然的界面”，也就是情感化的界面。未來的界面不會被鎖定在物理屏幕上，而是會集合五種感官的力量。因此，他們需要較少的學習曲線，理想情況下，根本沒有學習曲線。
情商情緒在商業中的重要性
除了使體驗更自然并減少學習曲線之外，為情感設計還為產品創造者帶來了另一個好處：它提高了用戶對產品的采用率?？梢岳萌祟悓η榫w的行動能力來創造更好的用戶參與度。
真實的語音界面
使用語音作為主要界面的產品正變得越來越流行。我們中的許多人使用Amazon Echo和Apple Siri進行日?；顒樱缭O置鬧鐘或預約。但是，目前市場上可用的大多數語音交互系統仍然具有自然的局限性：它們不會考慮用戶的情緒。因此，當用戶與Google Now等產品進行互動時，他們對與機器進行通信具有強烈的溝通感 - 而不是真正的人。系統可預測地響應，并且他們的響應是腳本化的，與這樣的系統進行有意義的對話是不可能的。
但是目前市場上有一些完全不同的系統，其中一個是Xiaoice，一個社交聊天機器人應用程序。這個應用程序的核心是情感計算框架，該應用程序的基礎是，首先與用戶建立情感聯系。Xiaoice可以動態識別情緒，并在與相關響應的長時間對話中吸引用戶。結果，當用戶與Xiaoice交互時，就像是與真人交談一樣。
Xiaoice的局限在于它是一個基于文本的聊天應用程序。很明顯，你可以通過基于語音的交互來實現更強大的效果（人聲具有不同的特征，例如可以傳達強大的情感譜的音調）。
我們中的許多人已經在電影“她”（2013）中看到了基于語音的互動的力量。Theodore愛上了Samantha（一個復雜的操作系統）。這也使我們相信，未來基于語音的系統的主要目的之一將是用戶的虛擬伴侶。這部電影最有趣的事情是西奧多沒有薩曼莎的視覺形象，他只有她的聲音。要建立這種親密關系，必須產生反映一致性格的回應。這將使系統既可預測又值得信賴。
技術離Samantha這樣的系統還有很長的路要走，但我相信語音優先的多模式接口將是語音接口發展的下一章。這樣的接口將使用語音作為主要交互方式，并在創建和建立連接感的上下文中提供附加信息。
為Brain.ai設計的語音界面示例（圖片來源：Gleb Kuznetsov）
AR體驗的演變
增強現實（AR）被定義為現實世界之上的數字覆蓋，并將我們周圍的對象轉換為交互式數字體驗。我們的環境變得更加“智能”，用戶對手指尖上的“有形”物體產生幻覺，從而在用戶和產品（或內容）之間建立了更深層次的聯系。
使用AR重新構想現有概念
AR的獨特之處在于它為我們提供了與數字內容進行物理交互的非凡能力。它允許我們看到以前無法看到的東西，這有助于我們更多地了解我們周圍的環境。此AR屬性可幫助設計人員使用熟悉的概念創建新的關卡體驗。
例如，通過使用移動AR，可以創建新級別的飛行體驗，允許乘客查看有關其班級或當前航班進度的詳細信息：
AR在空中客車A380的飛行體驗中。（圖片來源：Gleb Kuznetsov）
AR幫助我們找到通過空間的方式，并一目了然地獲得所需的信息。例如，AR可用于為您當前的位置創建豐富的上下文提示。被稱為技術SLAM（小號 imultaneous 大號 ocalization 甲 ND 中號 apping）非常適合此。SLAM允許實時映射環境，并且還可以將多媒體內容放入環境中。
為用戶提供價值的機會很多。例如，用戶可以將他們的設備指向建筑物，并在其屏幕上了解更多信息。它可以顯著減少工作量，并通過允許導航和訪問實現輕松的情感體驗。
在上下文中提供其他信息（圖片來源：Gleb Kuznetsov）
我們周圍的環境（例如墻壁或地板）可以成為交互場景，過去僅限于我們的智能手機和計算機。
你在下面看到的概念正是如此; 它使用物理對象（白墻）作為通常使用數字設備傳送的內容的畫布：
交互式墻的概念 - 在現實世界之上的數字覆蓋。（圖片來源：Gleb Kuznetsov）
避免信息過載
我們中的許多人都看到了名為“超現實”的視頻。在這段視頻中，物理和數字世界已合并，用戶被大量信息所淹沒。
技術允許我們同時顯示幾個不同的對象。當它被誤用時，很容易造成過載。
信息過載是一個嚴重的問題，對用戶體驗產生負面影響，避免它將成為AR設計的目標之一。精心設計的應用程序將使用AI的強大功能過濾掉與用戶無關的元素。
高級個性化
當系統實時地根據用戶的需求和期望來管理內容或功能時，就會發生數字體驗的個性化。許多現代移動應用程序和網站使用個性化概念來提供相關內容。例如，當您訪問Netflix時，您看到的電影列表會根據您的興趣進行個性化。
AR眼鏡允許創建新的個性化水平，即“高級”個性化水平。由于系統“看到”用戶看到的內容，因此可以利用此信息提出相關建議或在上下文中提供其他信息。想象一下，你很快就會戴上AR眼鏡，轉移到你視網膜的信息將根據你的需要量身定制。
從增強現實走向虛擬現實，創造沉浸式體驗
AR體驗具有自然的局限性。作為用戶，我們在內容和內容之間有明確的界限; 這條線將一個世界（AR）與另一個世界（現實世界）分開。這條線引起了AR世界顯然不真實的感覺。
您當然可能知道如何解決這個限制，即使用虛擬現實（VR）。VR并不是一種新的媒介，但只是在過去的幾年里，技術已經達到了允許設計師創造身臨其境體驗的程度。
沉浸式VR體驗消除了現實世界與數字之間的障礙。當你戴上VR耳機時，你的大腦很難處理你收到的信息是否真實。關于VR體驗如何在最近的將來看起來的想法在電影“Ready Player One”中有很好的解釋：
以下是設計人員在創建沉浸式虛擬環境時需要記住的內容：
1.寫一個故事
有意義的VR有一個強大的故事的核心。這就是為什么在你開始設計VR環境之前，你需要為用戶旅程寫一個敘述。一個稱為“故事板”的強大工具可以幫助您。使用故事板，可以創建故事并檢查所有可能的結果。當您檢查故事時，您將看到何時以及如何使用視覺和音頻提示來創建身臨其境的體驗。
2.與角色建立更深層次的連接
為了讓用戶相信VR中的所有內容都是真實的，我們需要創建與用戶所扮演的角色的連接。最明顯的解決方案之一是在虛擬場景中包含用戶手的表示。這種表示應該是實際的手 - 而不僅僅是一個操縱的復制品?？紤]不同的因素（如性別或膚色）至關重要，因為它會使交互更加真實。
用戶可以看到他或她的手，看他們看起來像一個角色。（來源：leapmotion）
也可以將現實生活中的一些對象帶到VR環境中以創建此連接。例如，一面鏡子。當用戶查看鏡像并在反射中看到他們的角色時，它可以在用戶和虛擬角色之間實現更真實的交互。
虛擬現實用戶會查看虛擬鏡像，并將自己視為VR環境中的角色。致謝：businesswire。
3.使用手勢代替菜單
在設計沉浸式VR體驗時，我們不能依賴傳統的菜單和按鈕。為什么？因為通過顯示菜單來打破沉浸感相對容易。用戶會知道他們周圍的一切都不真實。設計師不需要使用傳統菜單，而是需要依賴手勢。設計界仍然在定義使用手勢的通用語言，參與這項活動是有趣和令人興奮的運動。棘手的部分是讓用戶熟悉并可預測手勢。
Hovercast VR菜單試圖將現有的交互概念重用于VR體驗。不幸的是，這個概念可以打破沉浸感。新媒體需要新的互動模式。
4.與VR環境中的元素交互
要創建一個感覺真實的環境，我們需要讓用戶能夠與該現實中的對象進行交互。理想情況下，環境中的所有對象都可以以允許用戶觸摸和檢查它們的方式進行設計。這些物體將充當刺激，并將幫助您創造更加身臨其境的體驗。觸摸對于探索環境非常重要; 嬰兒在頭幾天獲得的最重要信息是通過觸摸獲得的。
5.VR
VR中分享情感有一個真正的機會，成為一個新的社會體驗水平。但為了實現它，我們需要解決一個重要問題，即將非語言線索帶入交互中。
當我們與其他人互動時，我們獲得的信息的重要部分來自肢體語言。驚喜，厭惡，憤怒 - 所有這些情緒都在我們的面部表情中，在面對面的互動中，我們從眼睛區域推斷信息。當人們在VR環境中進行交互以創建更真實的交互時，提供此信息非常重要。
好消息是頭戴式設備（HMD）將很快涵蓋情感識別。幾乎任何人與人之間的互動都將受益于VR中的面部表情。
在VR空間分享情感（來源：MITReview的 Rachel Metz ）
6.為VR環境設計聲音和音樂適合
音頻是沉浸式體驗的重要組成部分。如果不為環境設計聲音，就不可能創造出真正身臨其境的體驗。聲音既可以用作背景元素（即風的環境聲音），也可以用作方向性的。在后一種情況下，聲音可以用作提示 - 通過播放方向性（聲音來自哪里）和距離（可以將用戶的注意力集中在特定元素上）。
在為VR設計音頻時，制作聲音3D至關重要。2D聲音不能很好地用于VR，因為它使一切都太平。3D聲音是您可以在周圍的各個方向聽到的聲音 - 前方，后方，上方和下方 - 遍布整個地方。您不需要專門的耳機來體驗3D聲音; 可以使用HMD的標準立體聲揚聲器來創建它。
頭部跟蹤是良好聲音設計的另一個重要方面。讓聲音以逼真的方式表現至關重要。這就是為什么當用戶移動他的頭部時，聲音應該根據頭部運動而改變。
7.預防暈車
動是VR的主要痛點之一，這是一種在視覺感知運動和前庭系統的運動感之間存在分歧的情況，而讓用戶在體驗VR時保持舒適至關重要。
有兩種流行的理論導致VR中的暈動?。?
“感覺沖突”理論：根據這一理論，暈動病的發生是由于預期的運動和實際經歷的運動之間的感覺上的不一致。
“眼動”理論：在“ VR書：虛擬現實的以人為本設計 ”一書中，杰森杰拉德提到暈動病的發生是因為保持場景圖像在視網膜上穩定所需的不自然的眼球運動。
以下是一些提示，可以幫助您防止用戶接觸到病箱：
身體運動應與視覺運動相匹配。有時即使是小的視覺抖動也會對體驗產生巨大的負面影響。
讓用戶在移動場景之間休息（這在VR體驗非常動態時尤為重要）。
減少虛擬旋轉。
結論
當我們考慮產品設計的現代狀態時，很明顯我們只是處于冰山一角，因為我們僅限于平面屏幕。
我們正在目睹人機交互（HCI）的根本轉變 - 重新思考數字體驗的整體概念。在接下來的十年中，設計師將打破玻璃（我們今天所知的移動設備時代）并轉向未來的接口 - 復雜的語音接口，先進的AR和真正的沉浸式VR。當談到創造一種新的體驗時，必須要明白我們唯一的邊界是我們的大腦告訴我們它必須始終如一。
如果您想了解更多的前瞻信息和權威專家普修的專業性建議，就留言聯系我們吧！
來源：Gleb：Designing Emotional Interfaces Of The Future
https://www.smashingmagazine.com/2019/01/designing-emotional-interfaces-future/
<p style="margin-top:0px;margin-bottom:0px;padding:0px;outline:none;box-sizing:inherit;color:#666666;position:relative;font-size:16px;line-height:32px;text-align:center;">
<img src="https://img.zcool.cn/community/0186295d26b093a801214837432998.jpg" style="margin:22px auto 0px;padding:0px;outline:none;box-sizing:inherit;display:inline-block;vertical-align:top;max-width:100%;" />
</p>
<p style="margin-top:0px;margin-bottom:0px;padding:0px;outline:none;box-sizing:inherit;color:#666666;position:relative;font-size:16px;line-height:32px;text-align:center;">
用戶調研 丨 HMI設計 丨 UE/UI設計 丨 HMI培訓 丨 HMI評測 丨 體驗咨詢
</p>轉載請注明：站酷
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
項目可以簡單得理解為是氣象災害等級地圖展示系統，主要展示了圖表、表格、災害等級五色圖分布地圖
設計需求
1、逐步確認
項目的需求分析是通過客觀的業務數據逐步展開，逐步確定的。首先根據常用的業務邏輯來把需要展示的內容做一個排序，比如：餅狀圖、柱狀圖、趨勢圖等，決定可視化圖表與數據的結合。
2、從表格到一整張圖
由于產品經理角色空缺，項目并沒有原型線框圖。所以為了項目有效開展，首先將數據展示的維度列出一個表格（內容標題、橫縱坐標、有效信息等等），進行合理化的分析， 其次將現有的數據內容，結合表格中的橫縱坐標，套在一個可視化的板式中，做出一個初步的原型設計。
設計過程
1、設計風格
按照傳統大屏的設計配色，深藍色體現了豐富的科技感，倉儲式儀表盤的布局模式，體現了數據可視化的大氣。由于業務對象的原因，摒棄了太過花俏、復雜的邊框跟元素。
2、設計交互
交互的要點承接了業務需求的關系，整個大屏界面除了數據展示，還多了控制地圖展示的下拉界面、查看災情發生時間維度的控制軸以及播放動畫的按鈕等，是一個組合可交互的大屏展示，并不是只刷新數據那么簡單。
3、投入產品思維
由于沒有產品經理的空缺，設計承擔了大部分產品思路，主要體現在重點內容布局，頁面合理性邏輯性的一些考量。好在頁面只有幾張，不然整體的業務邏輯分析起來也增加了不少的思考時間。
4、改稿的心理素質
數據展示的內容與客戶期望存在一定的差異，當客戶沒有需求提出時，就要出不同的方案來驗證客戶的需求，從最初的版本到開發，中間經歷了7-8次改稿，很虐吧……
總結：
1、視覺與原型
從追求完美的角度出發，設計流程上應該有產品原型的體現，但是往往業務對接人員僅提供需求文字本身的情況下，設計師也要具備一定的產品能力，把視覺稿當成原型稿來做。
2、同質化與調研
大屏展示可視化一直都是層出不窮，怎樣做到既能滿足業務需求又要有獨特感以及設計感，可以歸結到項目開始的設計定位上，風格定位得越仔細，調研得越多，那么對設計亮點的融入會起到很大幫助！
轉載請注明：站酷
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
-提供一個啟動頁
-考慮屏幕方向
-不要提前詢問設置信息
-不要顯示授權協議和免責聲明
-重啟時恢復先前狀態
-盡量不要讓用戶重啟
-不要頻繁地讓用戶給你的App評分
-設計一個與您的應用的首頁幾乎相同的啟動頁
-避免在啟動頁上包含文本
-弱化啟動頁
-不要做品牌展示
(原指南將“啟動頁”放到視覺設計中, 因與本節關聯較大, 因此譯者整合到在此處)
-------------------------------------
啟動體驗很大程度影響用戶對APP的感受。 無論使用什么設備，無論自從上次打開APP過了多久，啟動體驗都應該是快速，無縫銜接的。
應用啟動時, 顯示啟動頁，然后迅速變為應用的首頁。 啟動頁的作用是在加載時給用戶一種印象——該APP響應迅速. 為確保從啟動頁無縫過渡，請將啟動頁設計成與首頁相似的、不會吸引關注的簡單頁面。
如果您的應用同時支持縱向和橫向模式，則應使用設備的當前方向啟動。 如果您的應用僅以一種方向運行，則應始終以該方向啟動，并在必要時讓人們旋轉設備。 除非有令人信服的理由，否則無論設備向左還是向右旋轉，處于橫向模式的應用程序都應正確定位自己的方向。
人們期望應用程序能夠正常運行。 為大多數用戶設計您的應用程序，讓少數需要不同配置的用戶調整設置以滿足他們的需求。 盡可能從設備設置和默認設置，或通過同步服務（例如iCloud）獲取設置信息。 如果您必須詢問設置信息，請提示人們在首次打開應用程序時提供該信息，并讓他們稍后在應用程序設置中對其進行修改。
在App Store顯示授權協議和免責聲明，以便人們可以在下載應用之前閱讀它們。 如果您必須在應用程序中包含這些內容，請注意不要破壞用戶體驗.
避免讓用戶手動返回之前的位置。保存和恢復APP的狀態，讓用戶可以從他們上次的地方繼續。
重啟需要花費時間，并且會讓你的APP顯得不可靠且難用。如果你的APP有內存或其他問題使其難以運行，你需要解決這些技術問題。除非是手機系統原因.
安裝后或在用戶使用你的APP時過于頻繁地彈出評分提示是很煩人的，你收到的有用反饋可能會反而因此減少。為了鼓勵用戶給出合理的反饋，你應該給用戶一些時間讓他們對你的應用形成自己的看法。并始終提供一種選擇退出評分提示的方法，永遠不要強迫用戶對你的應用進行評分。
-------------------------------------
當你的APP啟動時，啟動頁會立即出現，并很快被應用程序的首頁取代，給人一種APP響應迅速的印象。啟動頁不是一個藝術表達的機會。它只是為了增強你的APP快速啟動和立即準備使用的感覺。每個APP必須提供一個啟動頁。
不要在啟動頁面上使用靜態圖像。 如果您需要了解各種屏幕尺寸的尺寸以幫助您進行設計布局，請參見設備屏幕尺寸和方向。在iOS 14及更高版本中，啟動屏幕限制為25 MB。
如果您添加的元素在應用程序完成啟動時看起來有所不同，則人們可能會在應用程序的啟動屏幕和第一個屏幕之間遇到不愉快的閃爍。 還要確保您的啟動屏幕與設備的當前外觀模式(淺色/深色)匹配.
由于啟動頁中的內容不會更改，因此任何顯示的文本都不會本地化。
人們重視是否讓他們快速訪問內容并執行任務。 設計類似于應用程序界面的啟動頁會給用戶帶來“應用程序立即啟動了”的錯覺。 快速的啟動時間，結合這種設計方法, 會使您的應用程序響應迅速。對于游戲，啟動頁應正常過渡到游戲顯示的首頁。
啟動頁不是品牌機會。不要設計得看起來像品牌刊登頁或“關于”窗口。 除非品牌標志或其他品牌元素在應用首頁也固定出現，否則請勿包含徽標或其他品牌元素。 如果您的游戲或其他沉浸式應用在過渡到第一個屏幕之前顯示純色，則可以創建僅顯示該純色的啟動屏幕。
//然而事實是, 幾乎所有應用都會在啟動頁展示品牌logo. 只有apple官方的應用將“快速響應”的思路堅持到底. 我的看法是, 可以適當融入一些品牌元素, 但依然要考慮與首頁過渡, 避免閃爍感和等待焦慮, 盡量簡單、不引起注意, 從而帶來“快速響應”的啟動體驗.
----------------------------------------
3.2 新手教程 (Onboarding) & 加載(Loading)
轉載請注明：站酷
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
原文鏈接：https://developer.apple.com/design/human-interface-guidelines/ios/app-architecture/launching/UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
做一全套的APP設計，流程是：
1、界面設計：設計IOS界面；設計Android界面。
2、切圖：切IOS的2倍圖和3倍圖；切Android的hdpi,xhdpi,xxhdpi這三個尺寸的圖。
3、標注：以px為單位標注IOS界面的尺寸；以dp為單位標andriod的尺寸。
----------------------------------------------------------------------
IOS端_界面設計
————————
一、界面設計：
1、【界面分類】：IOS有 iphone5/5s/5c、 iphone6\6 plus、iphone7\7 plus、iphone8\8 plus、iphoneX等分辨率。
2、【設計方法】： 以iphone8為標準進行界面設計，讓開發進行適配。即750px*1334px以基準（72像素\英寸）。
3、【設計標準】：750*1334界面——狀態欄40px； 導航欄88px；標簽欄98px；工具欄88px；文字最大34px; 最小18px；常用28px。
————————
二、切圖：（所有開發寫不出來的都得切，如icon, 默認頭像，背景圖等）
1、【切圖尺寸】：IOS 只用切【二倍圖】和【三倍圖】。注意：有些button, 需要更改顏色，切一個“被點擊的狀態”（如btn-xxx-pressed@2x,btn-xxxx-pressed@3x）。
2、【切圖命名】：如btn-xxxx@2x,btn-xxx@3x(按紐); img-xxx@2x,img-xxxx@3x(圖像); bg-xxx@2x,bg-xxx@3x(背景圖)
3、【方法一】：【photoshop圖層-右鍵-導出為...】
設置大?。ˊ1x+@2x)；設置好icon的畫布尺寸（如導航欄上的幾個icon的畫布尺寸應保持一致）
【方法二】：【sketch-選中icon-右下角-make exportable】
（如需切相同尺寸的icon，需建立相同尺寸的畫布，并選擇整個畫布整體導出）
————————
三、標注：
1、【標注內容】：顏色＼長寬＼字號＼距離；
2、【標注單位】：IOS的標注以px為單位進行標注。（注意：數字最好為偶數）
3、【標注軟件一】: 標注神器－parker/markman，標注前請在“設置”里將單位改為px；
【標注軟件二（強烈推薦）】：zeplin軟件——無需標注，只需將界面導入zeplin，開發直接訪問zeplin，即可查看所有的尺寸、間距、色值、字體、字號等。
下載地址：https://zeplin.io/，軟件圖標和界面如下：
Android設計：
————————
一、界面設計：
1、【界面分類】：Android的尺寸非常多，非常雜?？偟恼f來，就分為這幾種模式：idpi, mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi。
2、【設計方法】：以xhdpi為基準進行界面設計，讓開發進行適配。即以720px*1280px為標準(72像素\英寸)。
3、【設計標準】： 720px*1280px界面——狀態欄50px, 導航欄96px，標簽欄96px，工具欄96px，實體鍵96px；文字最大36px;最小18px；常用28px。
————————
二、切圖：
1、【分類】：Android 的切圖需要切三個尺寸的：hdpi, xhdpi, xxhdpi。
2、【方法一】：切圖神器－cutterman，也可以一鍵切出hdpi, xhdpi, xxhdpi三個尺寸的圖, 而且還可以切出“點九圖”。
【方法二】：photoshop、sketch、illustrator皆可直接導出icon。
————————
三、標注：
1、【單位】：Android的標注以dp為單位。（parker里, 在“設置”里將單位改為dp）
2、【標注軟件】：同上，推薦zeplin軟件（建立文件夾時需選擇安卓版本）
----------------------------------------------------------------------
補充 _ 2019/4/10:
目前流行的是以【一倍圖】的分辨率來進行設計，也就是sketch、PS、AI上給的分辨率：
iPhone 8的分辨率是750*1334，而sketch、PS、AI上iPhone 8給的分辨率是375*667.
意思是設計平臺鼓勵設計師用一倍圖來設計，一方面是因為開發環境是以一倍圖的環境來開發的，因此一倍圖的設計稿無需開發再進行換算。
另一方面是icon導出時：@2x就是iPhone 8的尺寸、@3x就是plus的尺寸。利于icon尺寸的整數換算。
所以推薦大家用【一倍圖】的分辨率來設計。icon切圖分別導出2倍圖和3倍圖供開發使用。（而且sketch提供的IOS控件也是1倍圖的尺寸啊～～）
轉載請注明：站酷
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
寫在前面
B端產品和C端產品作為兩種很不一樣的產品形態一直服務著廣大的用戶。它們各有各的作用，有很多B端產品還是一個非常龐大的系統工程，甚至有很多的公司就是專注于開發B端產品，我從業以來曾經參與過很多的（兩位數）B端產品項目，有的是從0到1的開發，也有的是在原基礎上更新優化，下面就從我個人的設計經驗整理出一些觀點。
什么是B端和C端產品
概念：B端面向商家和公司，組織；C端面向普通的大眾用戶；
B端是指：business--泛指生意，商業，公司和組織； To B即是面向商家和公司，組織，是給專職專業的用戶使用的產品，例如微信公眾平臺給制定的公眾號持有人使用，某公司的指揮調度系統，某停車管理系統，以及相關的后臺管理系統等。C端是指：consumer--消費者，顧客，用戶，是指被設計為能給普通大眾使用的產品；To C即是面向普通的老百姓用戶，例如微博，QQ，微信，新聞客戶端，淘寶等；
幾乎男女老少都會使用的微信
面向專職崗位人員使用的后臺管理系統
兩者的不同點
C端產品追求極致的體驗，；B端產品追求簡約、高效的完成工作
C端產品是為了滿足用戶某一主要的、固定 的核心需求，因此設計的目標是圍繞著這個核心需求，簡單直接解決用戶的需求，追求的是極致的用戶體驗，因為對C端產品而言，產品不好用，體驗不好，用戶就流失了，也就沒有盈利的可能了。
B端產品的目標是幫助用戶把大量的復雜的工作，整理歸納，使得他們能高效便捷的完成工作，追求的是產品的簡約實用，提高效率，能很好的處理工作，有時候為了達成業務目標，甚至不惜犧牲部分用戶體驗。
To B端界面的設計應該要重點注意什么
很多新手設計師在接到新的需求的時候會沒有頭緒，不知道如何開展工作，在不了解業務的前提下很多時候被產品牽著鼻子走。那么問題來了，是拿到產品給過來的原型之后就開始設計了嗎？又或者沒有原型只有一些簡單的描述，又該如何開展呢。以下是我的幾個建議
1，要了解業務
因為B類產品不同于C類產品，并不是大多數人日常都會很普及用到的，所以就需要設計師主動的去了解行業，了解業務需求，不同的行業有不同流程和規則，甚至是一些特殊的需求；啟動用戶群體調研和用戶使用場景調研，有條件的可以開展用戶問卷調研甚至面對面訪談，整理出用戶的使用流程，調研后要求設計師自己能非常清楚這個產品的作用、用戶人群、和在特定的使用場景下的使用目標、和不同情境下的操作流程等。
2，交互流程設計
B端產品往往包含了比較復雜的業務，那在復雜的業務背景下如何通過設計來提高用戶的工作效率，這就對設計師有比較高的要求。在交互流程上要整理出一些操作路徑，要考慮它們的層級關系，先后順序，行業習慣等。通過操作體驗給用戶留下明確的印象，可以降低用戶的學習成本，提高產品的易用性。
To B端界面的視覺設計
①、界面布局，分固定的和自適應的分辨率兩種，一般來說自適應的布局比較適合操作和展示內容比較多的系統，固定的寬度的分辨率的布局一般多用1200px以適應適配更多低分辨率的顯示器，現在的大屏幕設備非常普及了，很多系統轉為以1400px的寬度來設計，至于用哪一種的布局要取決于產品的功能了。
界面布局視覺上的區分；當我們設計一個系統的主頁到時候，B端產品通常會分為很多功能模塊，即便產品經理會提供原型給UI設計師，他們有時候往往會在原型按照他們的想法來布局，這時候設計師需要主動地去了解業務去弄清楚各個模塊的主次之分。通過調研后，整理歸類任務模塊，按照業務流程和規則來區分模塊優先級。（圖例）
②、顏色，B端系統的界面顏色也非?？季?，按照系統的功能特性來定，一般常規的系統界面都是以白色底色配以一種主色調的顏色來搭配的；第二深色的底色界面，深色界面能起到一種很好的襯托界面內容（如大量文字，數據，圖形，視頻等）的作用，深色界面再附以一些點線面和光的元素就能營造出一種炫酷的科技感。三是現在流行漸變色，漸變色和純色會給人一種繽紛，輕松愉悅，有活力的年輕的感覺，所以大家在設計不同的B端系統界面的時候要考慮產品的功能性質來選擇用顏色。
③、導航，導航可以解決用戶在訪問頁面時：在哪里，去哪里，怎樣去的問題。一般導航會有「側欄導航」和「頂部導航」2 種類型。一：側欄導航：可將導航欄固定在左側，提高導航可見性，方便頁面之間切換；頂部可放置常用工具，如搜索條、幫助按鈕、通知按鈕等。適用于復雜的、功能多的中后臺的管理型、工具型網站。二：頂部導航，順應了從上至下的正常瀏覽順序，方便瀏覽信息；頂部寬度限制了導航的數量和文本長度
④、按鈕，通常B端產品分為較多的功能模塊，也對應有很多不同的按鈕，在設計按鈕的時候，我們第一要分清楚哪些按鈕對應哪些功能，在設計上要做出區分。
⑤、表格，表格的設計遵循簡潔和易讀性為主，表里面的文字內容是主要的設計重點，例如信息層次的明確、對齊的原則等。
⑥、彈窗，不僅有操作反饋的作用，同時又是一個承載更多的操作功能的容器，彈窗的設計要有規范性，組件化。
視覺設計方面除了常規的設計流程，我想說的是綜合考慮和相關的系統銜接，體驗的一致，視覺風格的統一和品牌的建設。
設計師還能做些什么
雖然設計師和產品經理以及開發已經溝通過相關的業務需求，但設計師一定要懂得切換角度來看待問題，一方面設計師的視角相對注重視覺上和交互上的設計細節；第二我們也要懂得站在開發和產品的角度考慮，哪些效果能不能實現，也是需要我們和開發同事密切配合的；另一方面要更加注重代入用戶的角度來思考，這樣才能做出合理適用的設計，甚至能挖掘新的需求，提出一些很好的建議，給產品和項目帶來加分和利好。
總結
因為B端產品業務需求，用戶目標，使用場景和用戶群體都不相同，所以設計師接到B端產品的設計需求時一定要先了解清楚業務，做好前期調研，其次要多站在用戶的角度來看待和設計產品。其實C端和B端產品，它們都要求要簡單實用和有效準確，都是為了更好的滿足用戶的需求，解決用戶的痛點。做好了以上這些關鍵點，無論遇到多么復雜的B端產品，我相信所有問題都會迎刃而解。
作者： chrisHCZ
轉載請注明：站酷
分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們取得聯系，我們立即更正或刪除。
藍藍設計( www.skdbbs.com )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司
藍藍設計的小編 http://www.skdbbs.com
