国产第|页草草影院

  • <xmp id="624qc">
    <optgroup id="624qc"></optgroup>
  • 大福利!UI設計器的顏色匹配方法

    發布時間:2020-07-21 11:33:00

    我們年輕的時候就可以很好的辨別顏色,但是為什么在用戶界面設計的時候,我們經常會發現很難很好的使用顏色,而那些和諧、恰當、愉悅的設計我想原因是我們對顏色缺乏理解和實踐,在設計的時候,很容易過度使用顏色。作為一個設計初學者,你需要掌握色彩的基本理論,通過實踐加深對色彩的認識,終能夠熟練地運用各種色彩來搭配出平衡宜人的設計。

    我們年輕的時候就可以很好的辨別顏色,但是為什么在用戶界面設計的時候,我們經常會發現很難很好的使用顏色,而那些和諧、恰當、愉悅的設計我想原因是我們對顏色缺乏理解和實踐,在設計的時候,很容易過度使用顏色。作為一個設計初學者,你需要掌握色彩的基本理論,通過實踐加深對色彩的認識,終能夠熟練地運用各種色彩來搭配出平衡宜人的設計。

    在使用色彩的初階段,你可能會感到一些困難。我的建議是多看一些優秀的作品,觀察身邊美麗的事物,從中獲得很多優秀的配色靈感,從而提高對色彩的認識。同時,在設計之初,盡量選擇柔和或中性的顏色作為背景,只在需要吸引用戶注意的元素或按鈕上使用顏色。隨著時間的推移,你會做得越來越好。

    配色的步是選擇主色。我建議從明亮柔和的底色或中性色開始。這樣的選擇往往比較安全,關鍵在于你如何使用它,并選擇合適的顏色來搭配它。

    以下顏色是蘋果本地應用程序中常用的顏色。這些顏色非常適合按鈕、圖標、菜單和其他視覺元素。

    記住不要過度使用顏色,只在需要指導用戶操作的地方使用顏色。

    當我們需要使用顏色時,首先了解顏色的相關特性是非常重要的。很多人選擇使用RGB顏色模型,但我想說的是RGB是一種計算機表示的顏色。很難說一種顏色由多少紅、綠和藍組成。作為一個設計師,HSB顏色模型更適合使用,因為色調、飽和度和明度是我們大腦對顏色的理解,這些屬性對我們理解和使用顏色更有意義。

    指在同一顏色中加入10-90%的白色或黑色透明層而得到的一組顏色。由于它們具有相同的顏色,能產生和諧的對比效果,所以單色在設計中的應用非常重要。

    在上面的例子中,通過調整黑色或白色層的透明度,可以獲得不同的單色,并且它們可以很好地相互協調。

    當你更熟練地掌握顏色選擇器時,你可以通過上下拖動來調整亮度和飽和度而不改變色調來獲得新的單色。

    指色調環中的相鄰顏色。顯然,這樣的配色方案不會產生高對比度。當你覺得你的設計過于單一的顏色,你可以使用相鄰的顏色來增加顏色的變化,這樣你的設計更層次和動態。

    例如,紅色是橙色的相鄰顏色,橙色是黃色的相鄰顏色。

    通過將色調值增加或減少30-50,可以獲得新的相鄰顏色。

    指色調環中相對的兩種顏色(彼此180度)?;パa色給人強烈的對比。例如,紫色按鈕在黃色背景上非常突出。當然,這也取決于每種顏色的飽和度。補色通常用于按鈕、警告和其他需要突出顯示的地方,但不正確的使用也可能使您的設計顯得非常唐突。通過實踐來理解。請記?。合喾吹膶Ρ?。

    通過將色調值增加整個色調條寬度的一半(即色輪中的相對顏色),可以獲得與當前顏色對應的互補色。

    它指的是由黑、白、黑混合而成的一系列不同色調的灰色。中性色不屬于冷色或暖色。它能起到中和作用。過度使用色彩會使整個設計缺乏可用性,而中性的色彩則有助于將用戶的注意力吸引回內容本身。

    使用中性色時,應盡量避免與主色沖突,因此建議始終將中性色的飽和度設置為接近0的值。

    主色通常很容易確定,但背景色和文字顏色有時很難掌握。它們的搭配非常精致,設計師需要足夠的經驗來將它們結合起來,并將它們調整到狀態。這里有一些中性的色板,我經常在用戶界面設計中使用。

    藍色是所有網站或應用程序界面中常用的顏色。給人一種安靜、寬廣、值得信賴的感覺。Twitter、Facebook、IBM、LinkedIn等商業巨頭都采用藍色作為主色調。藍色也更容易與其他顏色搭配使用。

    我們應該避免在UI中使用純黑色(×000)。純黑和其他顏色的對比太明顯了。

    如果要使用灰色,請使用亮度值低于30%或高于70%的灰色?;疑钠骄炼仁菃吸c的,不能很好地與其他顏色匹配。

    除了上面的藍色和灰色調色板外,我們還可以使用任何顏色自定義我們自己的調色板,但您始終需要將調色板彼此匹配。

    首先,滑動“色調”滑塊以選擇主色,然后選擇與主色相關的其他單色、相鄰色和互補色。后,通過調整這些顏色的飽和度和亮度來增加色彩的對比度和活力。

    通過有效地使用對比度,可以使內容更清晰、更易于閱讀。對比度好,一般會用兩極的顏色,如白色和黑色、淺藍和深藍、亮和低亮。

    在某些情況下,您需要權衡UI的亮度與品牌或可用性。例如,在iBook的應用中,當外部環境變暗時,它會自動切換到暗閱讀模式。

    另一個例子是applewatch,它完全使用黑色背景,與邊框很匹配。

    內容應該比背景更亮。亮度的對比度可以使要突出顯示的內容的輪廓更清晰、更易于閱讀

    不要過度使用顏色。色彩總能吸引人們的眼球,但過度使用往往會導致人們對主要內容的忽視。因此,顏色只在需要突出顯示的地方使用,例如重要按鈕和需要突出顯示的狀態。

    避免使用普通的白色,90%-的白色是合適的。

    不要用純黑色,很難看到細節,與白色的對比度會太高。

    如果你必須使用黑色,選擇使用深灰色作為替代,以消除過度的對比度

    使用藍色時避免使用灰色。深藍色和藍色很相配

    顏色也有意義。合理使用紅色、綠色、藍色和中性色,分別表示推薦運行、正運行、鏈路和非活動狀態。使用這些按鈕或功能時,避免混淆用戶。例如,不要使用綠色按鈕刪除。

    只要你注意觀察,周圍的一切都充滿了色彩的靈感。當你看到一幅美麗的圖畫、一件東西或一件數碼作品時,作為一個設計師,你首先注意到的可能是美麗和諧的色彩。然后你可以拍照或截圖并提取顏色。這樣,您可以使用這些提取的顏色生成新的調色板。

    一個優秀的IOS應用程序,可以幫助你從照片中創建顏色樣本。

    通過手動方式(肉眼識別顏色)創建調色板是理想的,但這需要對顏色有很好的理解。任何由自動工具識別生成的調色板總是缺乏準確性,因此使用自己的視覺。

    在下面的例子中,我選擇了支付寶應用程序的界面,對應用程序的主色、次色和中性色進行了識別和分析。

    主色一般與整個品牌的顏色一致。它用于圖標、按鈕和菜單。次要顏色可以選擇與主色調相同的顏色系統,也可以使用與主色調對比的顏色,如對比色、相鄰色等。次要顏色使用較少,只在需要用戶注意的地方使用,如留言提醒,打折促銷等需要明顯標示的地方。對于背景色,它們用來襯托內容,也可以起到協調整個應用色調的作用。這就是為什么我們同時看到明亮的主題UI和黑暗的主題UI。

    您還可以選擇不同的顏色模式,甚至移動顏色選擇徽標以選擇要添加到調色板中的不同顏色。

    在運球時,您可以瀏覽和保存顏色樣本。你可以找到所有的設計基于一種顏色來啟發你。

    您還可以選擇不同的顏色模式,甚至移動顏色選擇徽標以選擇要添加到調色板中的不同顏色。

    我常去的另一個地方是品脫。你可以在上面看到很多設計師收集的色板。下面是pintrest上的色板。

    了解顏色的基本原理,它們之間的關系,以及如何選擇顏色進行配色,對你來說是非常重要的。我建議你閱讀下面關于顏色的指南,它不僅解釋了顏色的基本原理,而且幫助你更深入地理解如何使用顏色。

    谷歌推出的材料設計色彩設計指南中推薦的調色板對你的webui或IOS設計也很有幫助。

    草圖選項板允許您輕松保存或導入全局或文檔選項板。推薦的調色板對你的IOS設計也很有幫助。我們通??梢詮娜终{色板開始,包括IOS、材質設計和flatui。

    IOS中有許多漂亮的漸變。通過選擇兩種匹配的顏色,然后簡單地設置它們,可以創建漸變效果。這里是一個優秀的梯度效果的集合。



    国产第|页草草影院
  • <xmp id="624qc">
    <optgroup id="624qc"></optgroup>