2024 年已經到來,對於 UX UI 設計界來說,這可能是UI UX 是過去幾年中最統一的趨勢。
首先,最確定的年份。 在下面的文章中,我將對各種設計趨勢進行評論,分析這種現象背後的原因,並為新設計師的成長給出一些建議。 UI(使用者介面設計)設計是UX(使用者體驗設計)的乙個子集,前者更關注數字介面的視覺表現,後者更關注使用者在實現目標時在整個過程中的感受。 綜上所述:UI注重產品的外觀和互動細節,注重介面的美觀性和易用性。
UX關注使用者使用產品時的整體體驗,關注使用者的需求、目標和情感。
雖然 UI 和 UX 是兩個設計領域,但在實踐中有很多重疊。 從國內的實際情況來看,新設計師不需要擔心兩者的差異,最重要的是提高他們的“設計技能”和“專業知識”。 1)便當布局2024年初,便當的概念莫名其妙又開始爆火,成為全網廣受推崇的風格。 這種布局的布局與日式便當盒非常相似,因此使用了便當(bento)的諧音。
簡潔的文案和高質量的文案**是實現Bento的關鍵。便當風格通常由許多大小不一的矩形組成,內容借助簡潔的文案和高畫質插圖呈現。 這種類似瓷磚的設計在早期的 Windows 手機上無處不在,但當時的螢幕尺寸太小,Bento 無法很好地渲染。 近年來,蘋果不厭其煩地在發布會上表演了《Bento Yitu Flow》,終於將這種風格發揮得淋漓盡致。 Bento的普及離不開硬體的發展:數字螢幕的尺寸和解像度急劇增加,這為Bento的落地帶來了土壤使用者接受多種資訊的能力提高,對更高密度資訊的渴望,也是Bento持續受歡迎的重要原因。再加上規則的視覺變化感、高效的資訊傳遞能力、響應友好等優點,便當不受歡迎實在是太奇怪了。 2) 網頁視差滾動蘋果孜孜不倦地執行並最終傳播開來的另一種設計風格是“頁面視差滾動”。 它的特點是,當使用者滾動時,內容將以與滾動相同的頻率呈現動態效果。
視差一詞源自希臘語“視差”,意思是變化,視差本質上是一種錯覺。 在網頁、應用程式和動畫的設計中,這種效果通常是通過故意改變前景和背景之間的移動速率來實現的,從而為產品帶來流暢和創造性的使用者體驗。 網頁視差滾動效果需要設計師和前端工程師的密切合作,也需要設計師和前端工程師有相關的效果實現經驗,才能達到良好的最終效果。 有了如此高的要求,視差滾動效果自然就成為凸顯產品實力的必要方式。 如果你是乙個致力於打造高階產品體驗的設計師,建議仔細研究一下這項技術,並將其應用到你自己的專案中。 ai視覺設計AI是乙個在2023年科技圈熱了一整年的概念,2024年能再紅一年應該是無可爭辯的。 對於設計人員來說,在這個階段了解AI設計能力的邊界是很重要的。 一般來說,現階段AI在產品端的幫助基本是閱讀理解,而在視覺端,則是產生高度的隨機性**,如何將這兩種能力結合起來,其實是乙個比較高階的知識。
Geker AI 是一種 AI 設計工具,可智慧型生成原型圖紙。正是因為AI的能力比較難以控制,所以筆者還是建議新設計師使用智慧型體型AI產品。 例如,Gekke AI(結合了大模型的閱讀理解能力和行業微調後的創意發揮能力,可以一鍵生成可編輯的產品原型圖,大大提高了產品經理的工作效率。 4)操場練習區越來越多的工具產品會在登陸頁面或官方案例中加入遊樂場(練習區),讓使用者在閱讀文案的同時加深理解。 遊樂場的概念最初來自開發領域,最初是指引入語法概念,讓學習者立即有乙個可以書寫的區域來增強學習。
每個介紹區域都可以自己操作,以增強互動性。這幾年,大部分功能介紹都會選擇配上一段**來提公升互動性,但被動觀看絕對不如讓使用者主動“玩”。 因此,我們看到,從2023年下半年開始,越來越多的產品將遊樂場的概念融入到產品介紹頁面,進一步提公升使用者接受新事物時的樂趣和效率。 關鍵視覺物件三維主視覺特效3D在國內已經流行了很多年,在早期各種雲服務平台相互滲透的時候,相信大家都看過下面這些等距3D風格的插圖。
用 C4D 渲染的等距 3D 元素已成為 B 面視覺效果的靈丹妙藥。近10年來,移動網際網絡的快速發展已經完全完成了智慧型裝置和高速網路的普及。 在這個過程中,使用者對數字介面的接受度已經變得非常高,這讓設計師有信心增加視覺細節和資訊量。蘋果產品在iOS 7(2013年)開始使用純粹的扁平化風格,近年來也朝著輕擬物化的視覺風格邁進,這極大地影響了整個行業對設計趨勢的判斷。 對於新設計師來說,3D設計可以作為另一種職業道路,但不要急於求成。 3D設計是一門非常注重實踐的學科,學習曲線還是比較陡峭的,如果沒有足夠的時間去練習和持續學習,很容易半途而廢。當然,如果最終能達到一定水平,對於設計師來說,收益還是很大的。 arvr元宇宙在蘋果Vision Pro正式上市之前,大家大概都覺得AR VR技術已經“酷”了。 直到 Vision Pro 在 2 月份售罄,設計師們才開始意識到,這裡不乏新技術和美好體驗,人們只是在等待合適的產品出現。
蘋果的Vision Pro可能會改寫VR類別的命運。可想而知,在Vision Pro的加持下,整個AR VR技術的命運或許被徹底改寫,相關需求也將迎來井噴。 未來,如果VISION產品能夠回落到普通人可以接受的水平,虛擬空間設計、3D、元宇宙等相關設計理念必將再次引領潮流,對各種數字產品體驗的設計產生影響。 7) 固體材料變化正是因為近年來3D風格的流行,元素才開始被賦予新的視覺素材。 相較於早期喜歡使用具有平面特性的重複紋理(如建築表面)的網頁設計師,近年來各種透明材料如透明玻璃、磨砂玻璃、亞克力等變得特別流行。
半透明玻璃成為近年來最熱門的視覺效果。當今各大的圖形設計軟體可以很容易地模擬玻璃的效果(背景中的高斯模糊),這使得玻璃成為一種比其他材料更難實現的材料。 如果要使用設計軟體進行繪畫,則需要特別注意高光的呈現,以增強材料的真實感。 8)深色模式深色模式已經流行了大約 3 年+,但我認為這種風格會繼續流行:越來越多的使用者開始有意識地嘗試在深色和淺色之間切換,並逐漸修復他們的習慣。 兩種模式之間的視覺差異如此之大,以至於使用者一旦習慣了一種模式,就很難適應另一種模式,這是不可避免的。
一旦你適應了一種色調模式,就很難適應另一種。在設計產品的色彩模式時,建議參考谷歌的MD規範或蘋果的色彩規範。 此外,如果將玻璃材質合理地新增到暗模式中,會更容易突出明感,呈現出非常細膩逼真的視覺體驗。 最後,不同的開發人員可能有不同的技術方案來實現深色和淺色圖案,設計人員必須與開發人員溝通和合作,以實現準確的色彩再現。 9) 霓虹燈和燈光效果黑暗模式的流行也帶來了衍生的視覺效果:霓虹燈和燈光效果。 在燈光模式最普遍的時代,很難實現燈光效果(因為背景是白色的),而深色模式為這些燈光的使用提供了很好的舞台。
光可以作為視覺主體,同時也可以不斷引導眼睛的流動。在深色模式下,光線往往會形成聚光燈效果,從而更好地突出主體,也使頁面或產品更具身臨其境的感覺。 考慮到仍有大量數碼產品尚未完成暗模式的轉型,光效作為暗模式的絕佳搭配仍有廣闊的空間。 10) 採用HMI設計的智慧型裝置隨著人們接受度的提高,手機和電腦以外的移動智慧型裝置已經開始進入千家萬戶。 近年來,新能源智慧型汽車和各種可穿戴智慧型終端越來越受歡迎。 隨著這些產品與人互動的場景更加複雜,設計中需要使用更多的新技術,人機互動的方式也擴充套件到了多模態(語音、身體、視覺等)的新時代。
國產新車勢力在車內體驗方面具有較強的競爭力。智慧型汽車是國內製造的重要力量,座艙和車機的體驗是各車廠產品實力的重中之重。 2024年,我們一定會看到各種新穎的HMI設計解決方案,引領整個行業的設計水平不斷向前邁進。 對於新設計師來說,以汽車HMI為主要設計方向也是乙個非常好的選擇。 以上就是筆者為大家總結點評的2024年UX UI設計趨勢。 整體2024年的UX UI設計趨勢是過去2到3年設計趨勢的延續,但年內發布的大量新硬體產品讓趨勢變化充滿想象。如果你是新設計師,建議至少選擇文中提到的趨勢之一作為你這一年的重點學習或研究方向,這樣可以更快地為自己積累與未來市場相匹配的設計能力。