Each year we learn something new about design and 2016 was no different.? After last year’s article had such a success we decided to make some predictions for 2017, so let's get started!
每年我們都研究一些新的設(shè)計(jì)風(fēng)格而线,2016年也是一樣杆查,在去年文章得到非常大成功后,我們決定再為2017年做一些預(yù)測(cè)坠狡,所以我們開始吧。
Design trends are influenced by media, technology, the fashion industry and, lately usability. A trend emerges slowly, gradually, making its way into all design branches, and then disappears in exactly the same way. Basically a design trend's life is no longer than one or two years. Design in 2017 will continue the trends that materialized in 2016 while adding some new influences, but the feeling is well known and familiar and you may have seen it in the past? couple of years. The main influencer remains Google's Material Design, that suffers a few changes.
設(shè)計(jì)趨勢(shì)被媒介菩收、科技抓艳、工業(yè)時(shí)尚济瓢、和最新地可用性所影響著。一個(gè)趨勢(shì)慢慢地棵帽、逐漸地出現(xiàn)熄求,滲透到所有的設(shè)計(jì)門類,然后以相同的方式消失逗概〉芡恚基本上一個(gè)設(shè)計(jì)趨勢(shì)的生命期不超過一兩年。2017年會(huì)繼續(xù)在2016年的已落地的設(shè)計(jì)趨勢(shì)上新增一些效果逾苫,這些設(shè)計(jì)都已被知道熟悉卿城,或者你在近年內(nèi)看過了。主要的受Google的Material Design的影響, 然而些許有些改變铅搓。
01.
Semi Flat Design
半扁平化設(shè)計(jì)
In the past few years flat design ruled the web design market but now, influenced by Material Design, it is becoming more dimensional. This transition begins with some light shadows, making it a semi flat design. The evolution of flat design from a minimalist style suits the new developing technologies. Flat design is still in, but it has undergone some improvements.
在過去的幾年內(nèi)扁平化主導(dǎo)著設(shè)計(jì)市場(chǎng)瑟押,但是現(xiàn)在受Google Material Design的影響,變得更趨向于空間化星掰。這個(gè)改變開始于一些輕微的光影關(guān)系多望,使之成為半扁平化設(shè)計(jì)。扁平化設(shè)計(jì)的進(jìn)程是用最簡(jiǎn)潔少量的設(shè)計(jì)來適應(yīng)當(dāng)時(shí)的開發(fā)技術(shù)蹋偏。扁平化設(shè)計(jì)仍然還算主流設(shè)計(jì)便斥,但它已經(jīng)經(jīng)歷了一些設(shè)計(jì)進(jìn)化。
The smooth shading adds a depth and complexity without destroying the flat design feeling. This is a new feature added to the flat trend and will continue to evolve in 2017.
平滑的光影增加了深度和細(xì)節(jié)但并不打破扁平化設(shè)計(jì)的感覺威始。這是一個(gè)新的增加到扁平化趨勢(shì)的特征枢纠,并且在2017年會(huì)繼續(xù)演進(jìn)。
02.
Cinemagraphs
電影動(dòng)圖
Cinemagraphs aren't the regular gifs we see all around the web. Cinemagraphs are still images with minor elements moving in them. This technique makes a simple photo more realistic by bringing it to life.
電影動(dòng)圖不是我們所見到網(wǎng)站里常規(guī)的GIF黎棠。電影動(dòng)圖是一種有細(xì)節(jié)元素運(yùn)動(dòng)的圖片晋渺。這種技術(shù)通過讓些許細(xì)節(jié)元素運(yùn)動(dòng)使得照片更加真實(shí)。
03.
More 3D
更多的3D
3D is definitely heading? our way and we are going to see its influence in all design fields. With the VR/AR revolution rapidly building momentum, this domain is evolving pretty fast.
3D絕對(duì)是當(dāng)仁不讓的重頭戲脓斩,我們將會(huì)看到它影響到所有的設(shè)計(jì)領(lǐng)域木西。伴隨著VR/AR革命快速發(fā)展勢(shì)頭,這一領(lǐng)域正發(fā)展的相當(dāng)快速随静。
04.
Animations
動(dòng)畫
Animations are more and more present in web design and they can be gifs, SVG, WebGL CSS or videos.Animations were definitely one of the biggest things in the last year’s? web design trends, so don't hesitate to use them.
動(dòng)畫越來越多的出現(xiàn)在網(wǎng)站設(shè)計(jì)中八千,可以是gifs,SVG,WebGL CSS或是videos吗讶。動(dòng)畫絕對(duì)地是去年的網(wǎng)站設(shè)計(jì)最重要的趨勢(shì)之一,所以不要猶豫使用吧恋捆。
05.
Landing Pages
登錄頁(yè)
In 2017 we will see a rise in? landing pages due to their potential for marketing purposes and their ability to better target visitors.
在2017年照皆,我們將會(huì)看到一個(gè)在登錄頁(yè)的提升,因?yàn)樗麄冞_(dá)到的市場(chǎng)潛力和它們能更好的瞄準(zhǔn)訪問者沸停。
06.
Geometric Shapes, Patterns, Lines and Circles
幾何圖形膜毁、圖案、線愤钾、圈
This trend started in 2016 and will definitely continue in 2017. You can personalize a website simply by adding some modern shapes, either flat or with a soft shadow.
這一趨勢(shì)開始于2016且肯定地會(huì)在2017年延續(xù)瘟滨。不管是在扁平化或是微光影的設(shè)計(jì)中,你可以通過增加一些現(xiàn)代化圖形而輕易地讓網(wǎng)站變得更加個(gè)性化能颁。
07.
Courageous Colors
大膽的用色
Use bold colors to make a statement. Material design and flat design go perfectly with bold colors. You can use the color palette provided by Google to choose and pair the colors you want.
使用大膽的配色來進(jìn)行設(shè)計(jì)杂瘸。Material design和Flat design和大膽果敢的配色會(huì)完美地搭配。
你可以使用Google提供的調(diào)色板來選擇和搭配你想要的顏色劲装。
08.
Innovative Scrolling and Parallax
創(chuàng)新的滾動(dòng)方式和視差設(shè)計(jì)
This visual idea is great to add a unique element to any website. From a multi layered parallax to a video parallax, anything is possible.
這個(gè)視覺創(chuàng)意非常適合作為一個(gè)獨(dú)特的元素增加到任何網(wǎng)站上胧沫。從多層視差到視頻視差,一切皆有可能占业。
Is a WordPress Plugin that allows you to create beautiful Parallax sections with more than one layer. Be creative and combine layers in any style you want. We create 12 different examples into guide your first steps to a beautiful multi-layer world. Play with layers.
是一個(gè)WordPress插件绒怨,允許你用很多層來創(chuàng)建漂亮的視差內(nèi)容。創(chuàng)造性的組合圖層到你想要的風(fēng)格設(shè)計(jì)谦疾。我們創(chuàng)建了12中不同的范例以引導(dǎo)你走進(jìn)一個(gè)漂亮的多層世界南蹂。來玩轉(zhuǎn)圖層吧。
09.
Color Transitions
顏色漸變
Color transitions are one of the biggest trends right now.? Beginning in 2016 and growing quickly? after, big names like Instagram decided to change their logos and images from a flat color to a multi-colored transitions. From logos to buttons or picture overlays, this trend is everywhere.
顏色漸變是當(dāng)下最流行的趨勢(shì)之一念恍。從2016年開始后發(fā)展迅速六剥,大品牌Instagram已把他們的logos和images從扁平化顏色替換成多色漸變。從logo峰伙、button還是疊加圖形疗疟,這一趨勢(shì)隨處可見。
10.
Mobile Browsing (Responsive Design)
移動(dòng)端瀏覽行為(響應(yīng)式設(shè)計(jì))
2015 and 2016 brought a considerable increase in mobile browsing. Tablets and smartphones are now the first choice when it comes to browsing websites surpassing desktops, laptops and tablets - and this trend will continue. Any websites not focused on responsive web design need to upgrade asap!
2015和2016年在移動(dòng)端的瀏覽行為有相當(dāng)大的增加瞳氓。在平板和智能手機(jī)上瀏覽網(wǎng)頁(yè)超越了在臺(tái)式機(jī)和筆記本電腦上策彤,成為目前的首要之選。而這一趨勢(shì)將會(huì)繼續(xù)匣摘。任何的未聚焦到響應(yīng)式設(shè)計(jì)的網(wǎng)站都需要盡快迭代店诗。
11.
Custom Graphics and Illustrations
定制化圖形和插圖
Stock photos are still pretty popular, but there has been a new trend growing significantly in 2016 that will increase in 2017: the use of custom made graphics and illustrations. If you want a unique looking website that any visitor will remember, contact a digital designer. So, less stock and more original, unique images.
堆積圖片的方式仍然比較流行,但是2016年有一個(gè)重要的新趨勢(shì)在2017年會(huì)繼續(xù)增強(qiáng):定制化圖形和插圖音榜。如果你想擁有一個(gè)獨(dú)特外觀的網(wǎng)站足以讓訪問者留下深刻的印象庞瘸,去聯(lián)系一個(gè)像素設(shè)計(jì)師吧。所以赠叼,少一些堆積圖片擦囊,多增加一些原創(chuàng)且獨(dú)特的圖形吧违霞。
12.
Creative Use of Neutral Space and Grid
創(chuàng)造性的使用負(fù)空間和柵格
In previous years? web design had been? adapted to organized columns and grids, but in 2016? we saw a considerable shift towards irregular layers and ultra-modern design.
在過去幾年里,網(wǎng)站設(shè)計(jì)已適應(yīng)了有組織化的柵格設(shè)計(jì)瞬场,但在2016年我們看到相當(dāng)大程度上已轉(zhuǎn)變成為不規(guī)則圖層和超現(xiàn)代化設(shè)計(jì)葛家。
13.
Storytelling
故事線
Websites are now starting to tell stories to convince customers to remain on the page. People tend to retain more from stories than they do from reading plain information.
網(wǎng)站現(xiàn)在開始用講故事的方式來說服用戶留下來。相比于閱讀蒼白的信息人們更傾向于留在故事里泌类。
14.
Lazy Loading
延遲加載設(shè)計(jì)
Lazy loading delays the loading of images in long web pages, basically it allowing information to appear at the point at which it is needed.
這種設(shè)計(jì)緩解了長(zhǎng)頁(yè)面的圖形加載過程,基本上是底燎,它允許了信息出現(xiàn)現(xiàn)在它需要出現(xiàn)的地方刃榨。
15.
Split Content
分割內(nèi)容設(shè)計(jì)
Split content is becoming popular in responsive web design and it splits the screen in two or more parts. A split-screen website will show the viewer several equally important messages on a single page. This trend is rising since late 2015, but in 2017 it will? grow further and is likely to be encountered on many websites.
分割設(shè)計(jì)在響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)中變得流行起來,這種設(shè)計(jì)把界面兩分或者分割更多双仍。分割后的網(wǎng)頁(yè)能夠在同一頁(yè)面中一次展現(xiàn)給瀏覽者更多等量重要的信息枢希。2015年底這種設(shè)計(jì)趨勢(shì)開始出現(xiàn),今年它會(huì)繼續(xù)發(fā)展并在很多網(wǎng)站設(shè)計(jì)中會(huì)遇到朱沃。
16.
Full-Screen Forms
全屏表單
No need to go to another page to fill out a form as the new websites are equipped with full-screen forms adapted to responsive design.
當(dāng)新的網(wǎng)頁(yè)配備了全屏表單且是響應(yīng)式設(shè)計(jì)苞轿,就再也不需要去到另外的頁(yè)面填寫表單了。
17.
Videos Everywhere
無所不在的視頻
Video content has increased in the last year and people are demanding high quality videos that tell a story. The video showed on the website can be short and broadcast in a loop, showing a product or a large scale cinematographic project that will keep the viewer interested in the story.
視頻內(nèi)容在去年有所增長(zhǎng)逗物,人們也需要高質(zhì)量的視頻來講述一個(gè)故事搬卒。網(wǎng)頁(yè)中的視頻可以是短暫且循環(huán)播放的,展現(xiàn)一個(gè)產(chǎn)品或者是一個(gè)大規(guī)模電影動(dòng)圖的項(xiàng)目翎卓,會(huì)保持瀏覽者對(duì)故事的興趣度契邀。
18.
SEO is Important
搜索引擎優(yōu)化很重要
Search Engine Optimization is very important in a website, so a beautiful website without a good SEO will probably be left behind the pack.
搜索引擎的優(yōu)化在網(wǎng)站設(shè)計(jì)中十分重要,所以失暴,一個(gè)漂亮而沒有好的SEO的網(wǎng)站很可能會(huì)被遺忘坯门。
19.
Hidden Navigation
隱藏導(dǎo)航
The hamburger menu creates many pro and con arguments over how difficult it is for users to find the menu, but one thing is for sure - this trend is here to stay and people will eventually get used to them.
漢堡包列表因?yàn)楹茈y被用戶找到而引起了很多好&壞的爭(zhēng)議。但是有一個(gè)是確定的逗扒,這一趨勢(shì)已經(jīng)保留下來古戴,并且用戶最終會(huì)適應(yīng)它。
20.
Tiny Design Details
見微知著的設(shè)計(jì)
The focus on details is really important this year. From minor details like navigation dots to corner logos, focus on the small details to get the job done.
今年關(guān)注于打磨細(xì)節(jié)的設(shè)計(jì)會(huì)非常重要矩肩。細(xì)節(jié)設(shè)計(jì)從導(dǎo)航欄中的點(diǎn)點(diǎn)现恼,到logos的邊角。關(guān)注于細(xì)節(jié)往往使工作完成的更好蛮拔。
21.
Logo Design Trends
Logo設(shè)計(jì)趨勢(shì)
21.1.Minimalist 簡(jiǎn)約
As all the big brands switch to a simpler, minimal design, this trend is here to stay.
當(dāng)所有的大品牌的設(shè)計(jì)變得輕量且簡(jiǎn)潔述暂,這一趨勢(shì)就保存下來。
21.2.Hand drawn 手繪
This is a trend that has been? in the spotlight for a few years now and it is perfectly fitting for a “hipster” business. This style is used for the café-restaurant industry, barbers or art and crafts.
這種風(fēng)格已經(jīng)出現(xiàn)幾年了建炫,它完美地適合一些潮流商業(yè)畦韭,被應(yīng)用于咖啡、餐廳、酒吧、和藝術(shù)手工等行業(yè)镀裤。
21.3.Negative space 負(fù)空間
This is an old trend, but in the past few years we have seen it emerge again and it will only grow in 2017, so it’s definitely something worth keeping an eye on.
負(fù)空間設(shè)計(jì)是一個(gè)經(jīng)典潮流木缝,但在過去幾年里我們看到它又一次出現(xiàn)怀浆,在2017年會(huì)更繼續(xù)孽惰,因此它絕對(duì)是一個(gè)值得你一直關(guān)注的事情识樱。
21.4.Cropping 裁剪
This trend is as minimal as it gets, showing just enough to know what a logo is all about and nothing more.
裁剪火的,做取舍赠法,只要展現(xiàn)出logo是什么就行麦轰,不需要更多。
21.5.Geometric 幾何的
This trend is certainly old-school, but it’s just one of those styles that will never die.
這個(gè)趨勢(shì)是十足的學(xué)院派砖织,但它是那種不過時(shí)的風(fēng)格之一款侵。
21.6.Line art 線條藝術(shù)
This trend is popular among the new and modern business.
這一趨勢(shì)流行于新興和現(xiàn)代的商業(yè)中。
21.7.Pattern 圖樣
Patterns are a new trend and this repetition is a unique way to make a business stand out. This original trend can be also used in the logo's presentation.
圖案是種新潮流侧纯,這是個(gè)獨(dú)特的方式能讓你的logo獨(dú)樹一幟新锈。
21.8.Animated logos 動(dòng)態(tài)圖標(biāo)
Motion design is a huge trend this year and we can find it in all design fields.
今年動(dòng)態(tài)設(shè)計(jì)是巨大的潮流,我們可以在所有的設(shè)計(jì)領(lǐng)域看到它的身影眶熬。
21.9.Vintage 復(fù)古
Vintage style is still in. Even if this trend has been present for some time now, it still has something left to say.
復(fù)古風(fēng)潮一直都在妹笆。即使它出現(xiàn)到現(xiàn)在已經(jīng)有一段時(shí)間了,但它仍然留有某種表達(dá)方式娜氏。
21.10.Color Transitions 顏色漸變
Color transitions are everywhere this year - even in logos.
顏色漸變的趨勢(shì)在今年隨處可見拳缠,包括Logo
21.11.Illustrations in logos 圖形標(biāo)志
Illustrations are a good way to give a unique and personal touch to a business logo. They are becoming increasingly popular this year.
圖形是一種讓你的商業(yè)logo獨(dú)特且個(gè)性的好方式。它會(huì)在今年變得流行起來牍白。
21.12.Photography in logos 圖片標(biāo)志
The mix of images with typography is really hot right now. They work really well together and it creates a contrast between them.
現(xiàn)在十分流行把圖片混進(jìn)排版中脊凰,他們?cè)谝黄鸫钆涞暮芎茫⒛軌蛐纬梢环N沖突對(duì)比茂腥。
22.
Typography Trends
排版趨勢(shì)
22.1.Big, bold & beautiful typography 夸大且美麗排版
Typography is maybe the most important part in creating an outstanding design. This year typography will be bold and big with statement titles.
排版可能是創(chuàng)造一個(gè)出彩的設(shè)計(jì)的最重要部分狸涌,今年的排版方式會(huì)配合標(biāo)題語更大更夸張。
22.2.Color transitions in typography 顏色漸變的排版
Color transition is definitely the "it" trend right now and you will find it in typography as well.
顏色漸變絕對(duì)是現(xiàn)在流行的趨勢(shì)最岗,在排版中你也能看到它帕胆。
22.3.Visual hierarchy 視覺層次
Typography hierarchy is really important in all design fields. Size and weight of the font can easily indicate which words or letters are the most important, so keep in mind this aspect when you create your text. You also have to remember that you can achieve a great visual hierarchy through the position and color of the text.
排版的層次感在所有的設(shè)計(jì)領(lǐng)域都很重要。字號(hào)大小和粗細(xì)可以輕易的表示出哪些字詞更重要般渡,所以在排版時(shí)候一定要記住這一點(diǎn)懒豹。同時(shí),你不得不記住驯用,通過文字的位置和顏色一樣可以達(dá)到很棒的視覺層次脸秽。
22.4.Tiny Typography 微小排版
Super small text is usually surrounded by negative space, but you can create a contrast between colors or images to make it more visible. You can also use animations to help it stand out.
超級(jí)小的文本通常被負(fù)空間包圍,但是你可以用顏色和圖片來創(chuàng)造對(duì)比而使他更明顯蝴乔。你也可以用動(dòng)畫來幫助它突出记餐。
22.5.Animated Typography 動(dòng)態(tài)的排版
Animations are everywhere even in typography. If you use a soft motion, you can’t go wrong this year.
動(dòng)畫無所不在甚至在排版中。如果你運(yùn)用一個(gè)輕柔的運(yùn)動(dòng)薇正,那么今年你不可能出錯(cuò)片酝。
22.6.Typography meets photography 當(dāng)版式遇到圖片
The combination between text and photography can achieve great looks. Take a look at these great examples.
文字和圖片的組合可以達(dá)到很棒的效果囚衔。下面看看這些非常棒的例子。
22.7.Geometric shapes and typography 幾何圖形和排版
Geometric shapes can also be combined with typography also, to achieve a modern result.
幾何圖形也可以和排版組合使用以達(dá)到一個(gè)現(xiàn)代的效果雕沿。
22.8.Font pairing 字體匹配
The use of two or more fonts together is still in trend this year. Check out the examples below for some interesting pairing that will help you on your projects.
兩個(gè)以上的字體搭配仍然是今年的趨勢(shì)练湿。看看下面這些有趣的范例搭配也許會(huì)幫到你的項(xiàng)目审轮。
Author: Loredana Papp-Dinea
Co-Author: Mihai Baldean