最新ui设计趋势_10个最新且有希望的UI设计趋势
最新ui設(shè)計(jì)趨勢
重點(diǎn) (Top highlight)
Recently, I’ve spent some time observing the directions in which UI design is heading. I’ve stumbled across a few very creative, promising and inspiring trends that, in my opinion, will shape the UI design in the nearest future.
最近,我花了一些時(shí)間觀察UI設(shè)計(jì)的發(fā)展方向。 我偶然發(fā)現(xiàn)了一些非常有創(chuàng)意,有希望和鼓舞人心的趨勢,我認(rèn)為這將在不久的將來塑造UI設(shè)計(jì)。
Here are the 10 trends based on my observations:
以下是根據(jù)我的觀察得出的10種趨勢:
Dawid Tomczyk, Ui8net (IG)Dawid Tomczyk ,Ui8net(IG)1.新 神經(jīng)同態(tài) (1. New Neuomorphism)
You’ve read it right! Neuomorphism is evolving and, I guess, it’s here to stay (whether you like it or not). It didn’t last long in its initial form, but it is changing towards more sophisticated and accessible direction. It’s almost like skeuomorphism, but with a fresh, modern, more aesthetic vibe.
您已經(jīng)讀對了! 神經(jīng)同質(zhì)化正在發(fā)展 ,我猜想它會(huì)一直存在(無論您是否喜歡)。 它最初的形式并沒有持續(xù)很長時(shí)間,但是它正在朝著更加復(fù)雜和易于訪問的方向發(fā)展。 它幾乎類似于擬態(tài),但具有新鮮,現(xiàn)代,更美的氛圍。
Left to right: Dominik Bednarz, Mufidul.design (IG), Halolabteam, Ariuka_dsgn (IG), Sajon007 (IG)從左到右:Dominik Bednarz,Mufidul.design(IG),Haolabteam,Ariuka_dsgn(IG),Sajon007(IG)2.軟漸變 (2. Soft gradients)
Gradients are not going anywhere! In fact, I’m seeing a lot of them, as backgrounds and on UI elements, such as buttons, cards and graphs.Mixing more than two colors to create a colorful blurry background is also a thing!
漸變無處不在! 實(shí)際上,我在背景和UI元素(例如按鈕,卡片和圖形)上看到了很多。 混合兩種以上的顏色以創(chuàng)建多彩的模糊背景也是一件事情!
Left to right: Victor.niculici (IG), Sun, Ashik, Interfacely.net, Halolabteam從左到右:Victor.niculici(IG),Sun,Ashik,Interfacely.net,Halolabteam3.幾何元素 (3. Geometric elements)
Both used as main background or theme, or just a detail to make the design look more interesting — geometric elements are getting more and more attention. They are often mixed to create a mosaic — and the result looks really cool!
兩者都用作主要背景或主題,或者只是用作使設(shè)計(jì)看起來更有趣的細(xì)節(jié)-幾何元素正越來越受到關(guān)注。 通常將它們混合在一起以創(chuàng)建馬賽克 -結(jié)果看起來非常酷!
Left to right: Emy Lascan, Zerotoone.de, DesigningUI.com, jajadesign (IG), Flowstudio.從左到右:Emy Lascan,Zerotoone.de,DesigningUI.com,jajadesign(IG),Flowstudio。4.柔和的背景 (4. Pastel backgrounds)
I have to say I love this trend. 🥰 I’ve seen a lot of astounding, lightweight, aesthetically pleasing designs with very delicate, bright pastel color schemes.It makes the designs look very modern, non-intrusive, fresh and delightful, in which content plays the main role, and everything else is just a subtle background.
我必須說我喜歡這種趨勢。 🥰我已經(jīng)看到了許多驚人的,輕巧的,美學(xué)上令人愉悅的設(shè)計(jì),以及非常精致,明亮的柔和配色方案。 它使設(shè)計(jì)看起來非常現(xiàn)代,不打擾,清新而令人愉悅,其中內(nèi)容起著主要作用,其他所有內(nèi)容都只是微妙的背景。
Left to right: batcz (IG), tranmautitram (IG), Purrweb_design (IG), Izmahsa (IG), tranmautritram (IG)從左到右:batcz(IG),tranmautitram(IG),Purrweb_design(IG),Izmahsa(IG),tranmautritram(IG)5.插圖和3D (5. Illustrations and 3D)
Illustrations are still a craze. Different styles, different color schemes, more or less abstract, so they match the product’s characteristics. Not only flat, but also imitating the 3D look. I believe they are a nice change after all these years of using stock images for every single digital project on earth! I give a few tips on how to create a simple illustration here:
插圖仍然很流行。 不同的樣式,不同的配色方案或多或少是抽象的,因此它們與產(chǎn)品的特征相匹配。 不僅平坦,而且模仿3D外觀。 我相信這些年來,對于地球上的每個(gè)數(shù)字項(xiàng)目都使用庫存圖像,這是一個(gè)不錯(cuò)的改變! 我在此處給出了一些有關(guān)如何創(chuàng)建簡單插圖的提示:
Left to right: Vladimir Gruev, c.sen_ (IG), Eddie Lobianovsky, cmarixtechnolabs (IG)從左到右:弗拉基米爾·格魯夫(Vladimir Gruev),c.sen_(IG),埃迪·洛比亞諾夫斯基(Eddie Lobianovsky),cmarixtechnolabs(IG)6.抽象形狀 (6. Abstract shapes)
Used for backgrounds and for different UI elements. They make the interface look more “organic” and playful, which I believe is a good thing. Edit the simpliest shapes (square, oval) with pen tool, play with different border-radius, try different colors/gradients, and you may end up with a very interesting outcome. Or just save yourself a few minutes and try the simple but amazing tool called Blobmaker.
用于背景和不同的UI元素。 它們使界面看起來更“有機(jī)”和好玩,我認(rèn)為這是一件好事。 使用鋼筆工具編輯最簡單的形狀(正方形,橢圓形),使用不同的邊框半徑,嘗試不同的顏色/漸變,您可能會(huì)得到非常有趣的結(jié)果。 或者只是節(jié)省幾分鐘時(shí)間,然后嘗試一種名為Blobmaker 的簡單但出色的工具 。
Left to right: UXdesignlabs (IG), dragonlee_design (IG), JIANGGM, reyiands (IG), Saepul Rohman從左到右:UXdesignlabs(IG),dragonlee_design(IG),JIANGGM,reyiands(IG),Saepul Rohman7.暗模式 (7. Dark mode)
Dark mode is a color-inverted version of the interface, to make it more accessible at midnight hours. Since I am a typical night owl, I often use dark modes to swipe through my favorite apps before going to sleep. When creating a dark mode, remember to keep the right contrast between different elements and typography.
暗模式是界面的顏色反轉(zhuǎn)版本,以使其在午夜時(shí)分更易于訪問。 由于我是典型的夜貓子,因此我經(jīng)常在睡覺前使用深色模式在喜歡的應(yīng)用程序中滑動(dòng)。 創(chuàng)建暗模式時(shí),請記住在不同元素和版式之間保持正確的對比。
Left to right: Hype4.com, nickelfoxstudio, purrweb_design (IG), Vadim Drut, UI8net從左到右:Hype4.com,nickelfoxstudio,purrweb_design(IG),Vadim Drut,UI8net8.某個(gè)角度的元素 (8. Elements at an angle)
Not only used for Dribbble shots, but also as a way to present different content on websites in a more non-standard way. It somehow makes the content looks more interesting and eye-catching. How to quickly achieve this effect? First, make a collage of elements at 0° degrees. Make them one group. Then, change the group angle (from 30° to 50°) and voila! This way you don’t have to change the angle of every single element by hand.
不僅用于Dribbble拍攝,還用作以非標(biāo)準(zhǔn)方式在網(wǎng)站上呈現(xiàn)不同內(nèi)容的方式。 它使內(nèi)容看起來更有趣和引人注目。 如何快速達(dá)到這種效果? 首先,對0°度的元素進(jìn)行拼貼。 使他們成為一組。 然后,更改組角度(從30°到50°),瞧! 這樣,您不必手動(dòng)更改每個(gè)元素的角度。
Left to right: Cuberto, Fireart Studio, Dogstudio, Hype4.com, Prakhar Neel Sharma從左到右:Cuberto,Fireart Studio,Dogstudio,Hype4.com,Prakhar Neel Sharma9.柔和的陰影 (9. Soft shadows)
Another favorite trend of mine. Soft shadows make the UI looks more in-depth. The effect is often very subtle but aesthetically pleasing. Shadows, in general, make certain UI elements more “clickable”, and they help to differentiate the hierarchy between content. You can learn how to do them here:
我的另一個(gè)最喜歡的趨勢。 柔和的陰影使UI看起來更深入。 效果通常非常微妙,但在美學(xué)上令人愉悅。 通常,陰影使某些UI元素更“可單擊”,并且它們有助于區(qū)分內(nèi)容之間的層次結(jié)構(gòu)。 您可以在此處了解如何進(jìn)行操作:
Left to right: andreisimon.design (IG), Shakib Ali, Felixlesoeuf (IG), Glebich (IG), Tranmautritram (IG)從左到右:andreisimon.design(IG),Shakib Ali,Felixlesoeuf(IG),Glebich(IG),Tramautritram(IG)10.簡單的厚字體 (10. Simple, thick typography)
I was never a fan of thin fonts, (ugh, the iOS7 era) so I am happy to see this trend go away. Right now I’m observing the usage of thicker, simple in form (almost square-looking), readable fonts. They make the interface look extra modern and polished. If you searching for a similar one to use, try Poppins, Montserrat (free) or Gilroy, Sofia Pro, Proxima Nova (paid).
我從不喜歡瘦字體(在iOS7時(shí)代),所以我很高興看到這種趨勢消失了。 現(xiàn)在,我正在觀察使用更粗,更簡單的形式(幾乎為正方形)的可讀字體 。 它們使界面看起來更加現(xiàn)代和優(yōu)美。 如果您要尋找類似的商品,請嘗試Poppins , Montserrat (免費(fèi))或Gilroy , Sofia Pro , Proxima Nova (付費(fèi))。
Have you seen any other trend worth acknowledging? Let me know down in the comments!
您是否看到其他值得肯定的趨勢? 讓我在評論中知道!
你喜歡這篇文章嗎? 😊 (Did you like this article? 😊)
I just released a >📚 UI DESIGN BOOK 📚<I 🖋 write about design and I’m a 👩🏻?🔧 co-founder/lead designer at HYPE4 design-driven software agency!
我剛剛發(fā)布了>📚 UI設(shè)計(jì)圖書 📚<我🖋 寫的設(shè)計(jì) ,我在👩🏻🔧共同創(chuàng)始人/首席設(shè)計(jì)師HYPE4設(shè)計(jì)驅(qū)動(dòng)的軟件代理!
UX Para Minas Pretas (UX For Black Women), a Brazilian organization focused on promoting equity of Black women in the tech industry through initiatives of action, empowerment, and knowledge sharing. Silence against systemic racism is not an option. Build the design community you believe in.UX Para Minas Pretas (UX For Black Women),這是一個(gè)巴西組織,致力于通過采取行動(dòng),賦權(quán)和知識(shí)共享的舉措來促進(jìn)科技行業(yè)中的黑人女性平等。 對系統(tǒng)性種族主義保持沉默是不可行的。 建立您相信的設(shè)計(jì)社區(qū)。翻譯自: https://uxdesign.cc/10-newest-and-promising-ui-design-trends-929562b25ad6
最新ui設(shè)計(jì)趨勢
總結(jié)
以上是生活随笔為你收集整理的最新ui设计趋势_10个最新且有希望的UI设计趋势的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
 
                            
                        - 上一篇: 高性能Mysql(一)
- 下一篇: mybatis学习(10): sql s
