Módní trendy ve webdesignu. Text v rámečku

Přeložila Katya Gonzul.

Internet je rychle se rozvíjející prostor. Na trhu se rychle objevují nové technologie a metody vývoje. Vylepšující nástroje poskytují větší svobodu při navrhování rozhraní a interakcí. A díky tomu se webové šablony a metody návrhu mohou během krátké doby stát módními.

Zde je pohled na trendy webdesignu, které byste měli znát v roce 2017. Ne všechny jsou nové; některé z nich jsou styly, které získaly a/nebo si udržely svou popularitu v roce 2016. V letošním roce se očekává jejich aktivní využití v designu webových stránek.

Existují také některé docela nové techniky a technologie, které můžete implementovat při vytváření webových stránek. Není nutné, aby je každý znal. Ale abyste zůstali mezi nejlepšími, můžete je použít.

Barva

Výběr barev pro web je nesmírně důležitý. To může ovlivnit emoce, myšlenky a míru konverze vašich návštěvníků. Jaké tedy budou barevné trendy pro rok 2017?

Pantone odhalil svou barvu roku – Greenery. Byl vybrán jako symbol nových začátků; osvěžující a revitalizující odstín. Neočekáváme, že každý web bude v roce 2017 zelený. Jsme si ale jisti, že se objeví několik webových návrhů inspirovaných touto barvou.

Pokud hledáte inspiraci na barevné kombinace, na některé z kombinací se můžete podívat na stránce Pantone Color of 2017.

Vzhledem k popularitě Google Material Design se barvy a barevné kombinace doporučené těmito principy designu pravděpodobně dostanou do seznamu TOP 2017. Barvy jsou jasné a výrazné. Dokonce i mimo GMD bylo v poslední době mnoho příkladů webdesignu zahrnujícího jasné barvy.

A nevypadá to, že by to v dohledné době mělo přestat. K úspěšnému výběru barevného schématu pro váš návrh můžete použít weby jako Material Design Palette a MaterialUI.

Duplex je obraz sestávající ze dvou barev. V uplynulém roce jsme již viděli mnoho těchto typů obrázků. Doufáme, že tento styl bude v roce 2017 ještě populárnější.

Stránky jako Spotify používají duplexní obrázky s velkým efektem. Možná jste si všimli, že dvě barvy jsou oblíbené i u ikon YouTube.

Web Adison Partners v rámci svého webdesignu úspěšně použil duplex.

Moderní retro

Stejně jako pixel art, vintage typografie nebo imaginace inspirovaná devadesátými léty je právě teď v centru pozornosti retro s moderním nádechem. V posledních letech to mělo velký vliv na design webových stránek.

Interaktivní životopis Robbieho Leonardiho je skvělým příkladem moderního retra. Kombinoval polomoderní pixel art styl s postranním rolováním ve videohře Super Mario.


Cukrovinky Sladké gelato z magnólie zvolil vintage design pomocí poutavé animace. To dává webu moderní vzhled a zároveň si zachovává kouzlo starého světa.

Černý trh Také jsem se rozhodl pro vintage v kombinaci s modulárním uspořádáním. Stránka má rustikální vzhled, který dokonale zapadá do toho, co nabízí Černý trh.


Kinematografie

Cinemagraphs jsou trvalé fotografie s prvky, které opakují pohyby. V poslední době jsou stále populárnější. A to je docela fér: kvalitní kinematograf vizuálně přitahuje pozornost.

Cinemagraph může být GIF nebo video. Oba mohou být poměrně velké velikosti souborů, pokud jsou natočeny ve vysokém rozlišení. Cinemagraphs ve formátu GIF snadno dosahují velikosti přes 3 MB, takže pro vás může být smysluplnější nahrát video.

Podívejte se na několik skvělých příkladů kinematografií na Flixel; je hostingová služba pro tento typ obrázků a videí. Rozhlédněte se kolem sebe a všimněte si vynikající práce.

Material Design

Material Design společnosti Google se objevil v roce 2014. V podstatě staví na principu papíru a inkoustu a převádí jejich kvality do digitálního formátu. Například pomocí stínů a okrajů označíte, čeho byste se měli dotknout: tlačítek.

Material Design si v posledních několika letech získává na popularitě díky četným tématům a šablonám vytvořeným pro CMS (Content Management Systems) a také front-end frameworky, jako je Twitter Bootstrap. Jednou z výtek, které můžete o této službě slyšet, je, že mnoho stránek Material Design je velmi podobných; možná až příliš podobné. Je to dáno přehnaným dodržováním stylu Material Design – namísto uplatňování základních principů.

Můžeme předpokládat, že uvidíme mnoho malých webových projektů, které přijaly MD tak, jak je. Nejen jeho principy, ale i samotný styl či téma. Pravděpodobně však uvidíme, že části designérské komunity aktivně odrazují od MD, nebo se alespoň staví proti stereotypnímu stylu, a zároveň zavádějí některé z jeho principů.

Skvělým příkladem Material Designu v jeho nejčistší podobě je Material Design Blog (nečekané, že?). Zde můžete vidět většinu principů MD v praxi.

Přímá kreativní typografie

V roce 2016 jsme viděli několik příkladů velmi kreativního využití typografie. Rok 2017 bude pravděpodobně i nadále posouvat hranice toho, jak návrháři pracují s textem. Buďte připraveni nejen na to, že text zabere hodně místa na obrazovce, ale také na neočekávaná, kreativní písma.

Digitální agentura Živit kombinovala typografii s videem a vytvořila stylový, prémiový web. Video přehrávané na pozadí je sledováno pouze jedním velkým písmenem od slova „nurture“. Videa a písmena se mění, jak procházíte sekcemi domovské stránky.

Přátelé je designová agentura se sídlem v USA. Na svých webových stránkách používá velké, tučné písmo, které opravdu vyniká jako jeho hlavní rys.

Modulární design

Modulární design není novinkou, ale v posledních letech si získává na popularitě. Jedná se o návrhový přístup využívající modulární mřížkový vzor. Při pohledu na data Google Trends můžeme od začátku roku 2011 vidět nárůst zájmu o modulární design (na základě údajů o objemu vyhledávání). A doufáme, že tento trend bude pokračovat i v roce 2017.

Stavět v Amsterdamu vytvořil velmi elegantní modulární design webových stránek. Tento přístup umožňuje jasně definovat každý obsah.

Univerzita Warwick Modulární design jsem také použil při návrhu své stránky.

SVG (škálovatelná vektorová grafika)

Už vás nebaví loga a změna velikosti jiných obrázků? Pokud ano, vyplatí se vyzkoušet soubory SVG namísto obvyklých formátů PNG a JPG. Formát SVG není vhodný pro všechny obrázky; budou pracovat pouze s vektorovou grafikou, takže žádné fotografie nebudete moci nekonečně měnit. U obrázků, jako jsou loga, však formát funguje skvěle.

SVG existuje již od roku 1999, ale stále se setkáváme s formáty PNG a JPG, kde by bylo vhodnější SVG. I když k nějakým změnám zřejmě dochází již nyní. Pravděpodobně zaznamenáváte stále více souborů SVG a data Google Trends ukazují, že zájem o formát roste od roku 2013. V letošním roce dojde k ještě většímu rozšíření formátu a také k mnoha novým článkům na toto téma.

Proč používat SVG? Hlavním důvodem je, že váš obrázek SVG by se měl zobrazit perfektně bez ohledu na měřítko. Obrázky SVG mají navíc tendenci být velmi malé. To funguje ve prospěch rychlosti vaší stránky.

Pokud chcete vidět příklad skutečného SVG, nehledejte dál: podívejte se na logo WPMUDEV v levém horním rohu jejich stránky. Pokud přiblížíte pomocí prohlížeče, uvidíte, že se logo nerozpixeluje bez ohledu na to, jak moc se přiblížíte. Naopak logo WPMUDEV zůstává ostré a kvalitní.

Flexbox

Flexbox je režim rozvržení CSS3, díky kterému je mnohem efektivnější a předvídatelnější při práci s rozvržením stránek, které se zobrazí na různých velikostech obrazovky a na různých zařízeních.

Flexbox neustále nabírá na síle. A přitom ho v současnosti podporují všechny moderní prohlížeče. Pravděpodobně jej bude využívat stále více front-endových vývojářů. Více o Flexboxu si můžete přečíst v našich příručkách: Porozumění CSS3 Flexbox pro čistý responzivní design bez hackování a Porozumění mřížkám CSS pro moderní design webových stránek WordPress.

360° video a virtuální realita

Rok 2016 byl rokem VR (virtuální reality). Bylo vydáno mnoho herních VR headsetů a videa v plném pohybu překonala všechny rekordy ve vyhledávání. Doufám, že v průběhu tohoto roku designéři vymyslí zajímavé způsoby, jak začlenit 360stupňová videa do webových stránek.

Pokud jste to ještě nevěděli, Google VR View je JavaScript API (rozhraní pro programování aplikací), které vám umožňuje snadno přidat 360° video na váš vlastní web.

Interaktivní webová VR byla vytvořena pro nový film „The Blair Witch Project“ ( Blair Witch). Nejlépe se to dá sledovat na mobilním telefonu pomocí VR headsetu.

Mikrointerakce

Mikrointerakce jsou jednotlivé okamžiky, kdy uživatel interaguje s vaším webem. Nemusí to být vždy stránka sama o sobě, ale v našem případě je to přesně tak. Těmito okamžiky mohou být akce, jako je „hodnocení“ příspěvku, odeslání zprávy nebo vyplnění průzkumu. Účelem mikrointerakcí je poskytnout uživateli zpětnou vazbu a vedení a zároveň zlepšit uživatelskou zkušenost.

V roce 2016 se objevilo mnoho zajímavých stránek, kde se jasně projevily moderní trendy. Není pochyb o tom, že příští rok nám přinese mnoho úžasných designových řešení. Některé trendy samozřejmě upadnou, jiné naopak začnou nabírat na síle. Je poměrně těžké předvídat, jak se věci ve skutečnosti vyvinou, ale už teď se můžete podívat, jaké trendy ovládnou webdesign v roce 2017.

Pozor, obsah

Rychlý rozvoj webu vedl k tomu, že se designéři nechali příliš unést samotným designem: postranní panely, záhlaví, reklamní bannery, vyskakovací okna, tlačítka sociálních sítí, výzvy k akci, registrační formuláře... To vše, je to samozřejmě velmi potřebné, ale ve výsledku se ukázalo, že stránky jsou přetížené funkčními prvky, které zabíraly hodně místa a odváděly pozornost uživatelů od toho nejdůležitějšího – obsahu.

V roce 2017 tedy můžeme zaznamenat pomalý pohyb zpět k základům, kdy designéři kladou hlavní důraz na obsah. Některé funkční prvky již nebudou aktuální, je dost možné, že se přehodnotí jejich design a možná se objeví nová, srozumitelnější funkčnost. Již nyní je cítit, že trend ke zjednodušování nabývá na síle, takže pohyb k základům není regresí, ale pohybem vpřed. Uživatel nepotřebuje vymyšlená tlačítka CTA ani registrační formuláře – vše, co dnes lidi zajímá, je obsah a návrháři jej musí dodávat způsobem, který návštěvníkům webu nebrání v interakci s obsahem.

Konec éry plochého designu

Zdá se, že flat design dosáhl vrcholu svého vývoje: objevilo se mnoho webových stránek, které vypadají úplně stejně a v jejich designu není cítit individualita ani kreativita. Stejné techniky, podobné prvky, společná barevná schémata – to vše vedlo ke znatelné monotónnosti designu webových stránek.

Flat design byl donedávna velmi „žhavým“ trendem, měl svou estetiku, opak estetiky skeuomorfismu, a navíc flat design velmi dobře zapadl do mobilního prostředí. Ale touha po sjednocení v některých ohledech neprospěla webdesignu jako celku: weby a aplikace se staly tak podobnými, že designéři musí vynaložit značné úsilí, aby jejich projekty vynikly od konkurence. Flat design samozřejmě nikam nesměřuje, ale jeho triumfální pochod jako nejaktuálnějšího trendu se zdá být u konce.

Geometrické tvary, linie a vzory

Geometrické tvary a různé vzory byly jedním z nejnápadnějších trendů minulého roku a tento trend s námi zůstane i v roce 2017. Existuje mnoho způsobů, jak využít geometrické tvary v designu webových stránek. Nejsou to jen obrazy vepsané do kruhu, které se nacházejí všude - rozmanitost tvarů a vzorů je tak velká, že nic neomezuje fantazii designéra. Použití zajímavých vzorů, linií a tvarů může posunout váš návrh na další úroveň a přidat vašemu webu osobitost. Plochý design zbavuje webové stránky jejich identity, takže designéři hledají způsoby, jak tento problém vyřešit a různé nestandardní prvky jim pomáhají učinit vzhled webových stránek jedinečným a rozpoznatelným.

V roce 2016 byl velmi patrný trend k používání hlaviček s nestandardním designem. Objevilo se mnoho stránek, kde hlavním prvkem na hlavní stránce bylo jméno. Logo, které se obvykle nachází v levém horním rohu stránky, často ustoupilo efektnímu nadpisu v krásném písmu. To vše je výsledkem touhy po originalitě – designéři hledají příležitosti k vyjádření své kreativity a působivá typografie je skvělý způsob, jak dát webu tolik potřebnou osobitost. Je nepravděpodobné, že by se tento trend rozšířil za umělecké projekty a zábavní sektor. Nestandardní nadpisy by však měly být použity, pokud to styl projektu umožňuje. Ve všech ostatních případech by bylo vhodnější klasické logo v horní části stránky.

Ve snaze o pozornost uživatelů používá mnoho značek v designu svých webových stránek dvoubarevné obrázky a neobvyklé přechody. Duotone byl pozoruhodným trendem minulého roku a není pochyb o tom, že mnoho návrhářů bude tuto techniku ​​používat i v budoucnu. Možná to někdy nebude pouze duotón, obrázek může obsahovat i jiné barvy, pokud to umožní dosáhnout požadovaného efektu. Zároveň dnes snímky, kde je duotone kombinován s gradientem, vypadají velmi svěže. Flat design „pomohl“ zbavit se většiny přechodů, ale nyní jsou opět zpět, v pozměněné, ale zároveň velmi atraktivní podobě.

Široké využití animace

Animace je v designu webových stránek stále běžnější, protože je to skvělý způsob, jak uživatelům sdělit, co by měli dělat, nebo jednoduše rychleji sdělit hlavní myšlenku. Dříve se uživatelé zabývali běžnými GIFy, ale nyní nabírá na síle trend, kdy se animace provádí pomocí možností SVG a CSS. Tento přístup je složitější, ale zároveň vám umožňuje realizovat téměř jakýkoli nápad designéra.

Je jasné, že používání animace bude v roce 2017 ještě běžnější, protože obsah se stává interaktivním a animace zrychluje a usnadňuje interakci s uživatelem. Čtení textu nebo sledování videa zabere čas, ale s pomocí animace můžete dosáhnout svých cílů za mnohem kratší dobu.

Zjednodušená navigace

Podíl uživatelů mobilního internetu neustále roste. Jak se společnost stává mobilnější, dřívější přístupy k navigaci na webových stránkách již nefungují. Uživatelům je třeba pomáhat s orientací na webu, a to lze provést pouze zjednodušením navigace.

Stránky s velkými nabídkami se stávají minulostí, uživatelé již nechtějí trávit spoustu času hledáním potřebných informací, takže stále více webů opouští složitou navigaci a nechává v nabídce 4–5 položek. Zbývající navigační prvky, pokud existují, zůstanou skryté a zobrazí se pouze v případě potřeby.

V UX designu je klíčová pozitivní uživatelská zkušenost. Mikrointerakce by proto měly uživatelům pomoci pochopit, jak interagovat s rozhraním bez zbytečných zmatků. Listování fotkami, posouvání grafiky a další uživatelské akce by měly být co nejpřirozenější. Tím, že pomůžete uživateli efektivně interagovat s aplikací, můžete pomocí mikrointerakcí povzbudit lidi, aby si obsah prohlíželi. Hlavní věcí je neustále udržovat pozornost uživatele tím, že mu nabídne pohodlné možnosti pro prohlížení zajímavých informací. Široké přijetí mobilních zařízení učinilo z mikrointerakcí jeden z nejpozoruhodnějších trendů roku 2016 a není pochyb o tom, že tento trend bude jedním z nejdůležitějších v příštím roce.

Vlastní grafika

Designové prvky, které vypadají, jako by byly nakresleny ručně, jsou stále žádanější. Týká se to nejen obrázků – velmi často lze v designu vidět ručně psané fonty, originální grafiku, nestandardní tlačítka nebo ikony. Malé změny v designu známých prvků mohou dát webu individualitu, učinit jej „živějším“ a atraktivnějším pro uživatele. Pokud specifika projektu umožňují neformální přístup, pak použití vlastní grafiky bude vynikajícím způsobem, jak vyřešit problém bez použití standardních prvků.

Rostoucí význam vstupních stránek

V dnešní době, kdy uživatelé komunikují s různými typy obsahu, je důležité poskytnout jim informace, které potřebují, co nejrychleji. Proto v roce 2017 zaznamenáme nárůst důležitosti vstupních stránek. Velká pozornost bude stále věnována designu domovské stránky, ale někdy je na webu tolik obsahu, že je prostě potřeba jej kompaktně umístit na vstupní stránky. Tento trend řídili marketéři, kteří chtějí přivést návštěvnost na vyhrazené vstupní stránky, aby uživatelům pomohli rychleji najít to, co potřebují.

Místo závěru

Čas ukáže, které trendy ze scény odejdou a které zůstanou. Objeví se i nové trendy – přestože si mnoho lidí myslí, že se webdesign přestal vyvíjet, absolutně tomu tak není. Takže příští rok můžeme všichni očekávat, že uvidíme spoustu krásných webových stránek s neobvyklým designem.

Ryan McCready, editor obsahu pro infografickou designovou službu Venngage, hovoří o tom, co je právě teď populární v grafickém designu a jaké techniky byly letos opuštěny.

Výrazné a zářivé barvy

Během několika posledních let mnoho technologických lídrů používalo tlumené a snadno čitelné barvy. Pokusili se tedy vytvořit velmi přehledné designové schéma a ukázat, že elegantní a funkční budoucnost, která se obvykle ukazuje ve sci-fi filmech, již dorazila.

Tato metoda pomohla společnosti posunout se do nové fáze vývoje a sjednotit všechny své aplikace pod jednu barvu. Stejně jako u Spotify toto odvážné použití jasných barev umožnilo značce vyniknout.

Móda pro výrazné a jasné barvy v designu vychází z principů Material Design společnosti Google. Společnost zvolila plochý, efektivní a intuitivní design s přidáním „neočekávaných a energických barev, stejně jako funkčních a oku lahodících písem a obrázků“.

Obecně platí, že mnoho současných trendů v roce 2017 vzniklo pod vlivem zásad Material Design společnosti Google.

Použili jsme je také k vytvoření tohoto propagačního obrázku e-knihy. V důsledku toho se obraz stal neuvěřitelně populární.

Pokud máte potíže s výběrem nejlepších barev pro svůj design, přečtěte si několik skvělých příkladů barevných palet. A nebojte se použít barvy, které spolu kontrastují.

Tučné písmo

Tučné písmo přitahuje pozornost čtenářů. Mimovolně věnujete pozornost velkým a poutavým nápisům.

Můj oblíbený příklad je Wired. Ke zvýraznění konkrétních nadpisů a udržení hierarchického pořadí informací na stránce používá různá písma.

Stačí se podívat:

Dalším dobrým příkladem použití chytlavých písem je HubSpot. Text je v popředí a je podpořen grafikou:

HubSpot chápe, že každý rok se doba potřebná k absorpci informací z tweetu blíží nule. Proto, aby upoutaly pozornost čtenáře, používají krátké a stručné nápisy tučným písmem.

Nyní navíc stále více lidí surfuje na internetu z mobilních telefonů. Kvůli obrazovkám s vysokým rozlišením roste potřeba používat tučné písmo. Chcete-li si tedy udržet čtenáře, musíte svůj obsah dodávat správným způsobem.

Buffer zvýrazňuje nadpisy v celém článku, nejen na začátku – články se tak snáze čtou na všech zařízeních. Tento přístup doporučuji používat u dlouhých článků – pomůžete tak čtenářům se v nich orientovat.

Tuto metodu jsme použili při vytváření této infografiky. Pozornost přitahuje kombinace výrazného písma a zajímavých barev:

Fonty z Google Fonts

Google Fonts používám už dlouho, protože jsou tak univerzální. Pokud potřebuji vymyslet návrh online publikace a následně ji přidat do prezentace, jsem si jistý, že všechna písma budou dobře spolupracovat. Všechny vypadají skvěle na jakékoli blogovací platformě nebo webu.

Mimochodem, všech 810 písem je zcela zdarma! Ach ano, lidé mají rádi věci zadarmo. Mají také rádi věci, které se velmi snadno používají. Zde je jeden příklad kombinace několika oblíbených písem od Googlu:

Na našem webu používáme fonty Roboto a Open Sans.

Originální fotky

Každým rokem roste množství obsahu, stejně jako potřeba vysoce kvalitních obrázků. Aby fotografie vydržely co nejdéle, snaží se autoři, aby byly co nejuniverzálnější.

Je tu jen jeden problém: nejlepší obecné obrázky mají tendenci časem zatuchnout. Pokud sledujete novinky v oblasti technologií a marketingu, pak tuto fotografii pravděpodobně znáte:

Používá se na vstupních stránkách, blozích a dokonce i v příspěvcích na Instagramu. Abych byl upřímný, vzal jsem to sám za web, na kterém jsem pracoval před několika lety. Vzhledem k oblibě takových stock obrázků prudce klesla originalita grafického obsahu.

A nutnost používat jasné a dokonalé fotografie situaci jen zhoršila.

Když čtenář vidí stejný obrázek po sté, myslí si, že se autor článku nesnažil být alespoň trochu originální. Tak proč číst takový článek?

Proto byste měli používat originální obrázky. Přestaňte fotit oblíbené obrázky, začněte vytvářet své vlastní.

Jsem si jistý, že každý ve vašem týmu má telefon s fotoaparátem. Proč je nepoužíváš? Vyfoťte svou kancelář nebo logo a použijte tyto fotografie.

Zjistěte, zda se mezi vašimi kolegy nenachází ctižádostivý fotograf. Dejte mu pár dní na pronájem kanceláře – a fotek budete mít dost na celý rok!

Když jsme vytvořili naše nové webové stránky, vyfotografovali jsme naše zaměstnance a výsledek nás velmi potěšil.

Ručně kreslené obrázky a ikony

Originální musí být nejen fotografie, ale i ikony a kresby. Některé značky si to již uvědomily a snaží se tímto způsobem vyčnívat z davu. Tento přístup dodává designu prvek osobního a zábavného charakteru.

Někteří říkají, že tento trend vypadá neprofesionálně a dětinsky, ale přesto je rozhodně poutavý. Jako většina trendů roku 2017 působí jako alternativa k sterilně čistému designu posledních let.

Dropbox používá v celém textu ručně kreslené ilustrace. Staly se součástí značky společnosti a učinily ji rozpoznatelnou.

Takové ilustrace vytvářejí uvolněnou náladu a potěší dítě, které žije v duši každého z nás. Díky nim vypadá produkt cenově dostupnější. Jsou zvláště účinné ve velkých technologických společnostech, jako je Dropbox.

Dalším úspěšným příkladem tohoto přístupu je matracová společnost Casper. Téměř celý její web tvoří ručně kreslené kresby. Zde je jeden z nich:

Trend zachytila ​​i služba MailChimp. Ve zprávě z roku 2016 také ukazuje podobné kresby.

Moz, společnost, která vyvíjí marketingový software, vkládá ilustrace do záhlaví článků:

Někdy se naše láska ke kresbám projevuje v jiných projektech:

Návrat ke kořenům minimalismu

Kdybyste byli požádáni, abyste cizímu člověku vysvětlili, co je minimalismus, pravděpodobně byste odpověděli, že je to tehdy, když se musíte vzdát dekorativnosti ve prospěch funkčnosti. S největší pravděpodobností vás okamžitě napadne neutrální barevná paleta skládající se z odstínů černé, šedé a bílé.

Zdá se, že skutečný duch minimalismu byl vytlačen použitím nudných černobílých barevných schémat. Zdá se mi, že to bylo provedeno záměrně, aby se kompenzovala malá velikost obrazovky a nízký výkon mobilních zařízení.

V roce 2017 se ale vše změní. Minimalismus se vrátí ve své skutečné podobě. Což znamená, že bude více barev. V dnešní době jsou mobilní zařízení stejně výkonná jako počítače a některá mají dokonce lepší obrazovky.

Mým oblíbeným příkladem minimalistického designu je logo Medium platformy. Jeho tvůrci dokázali zkombinovat několik různých barev a přitom zachovat minimalistický styl.

Google provedl další redesign loga ve prospěch minimalismu a kombinace jasných barev. Je pozoruhodné, že právě tato společnost sloužila jako katalyzátor pro vznik mnoha nových trendů. Návrháři mírně ořezali písmo a představili nový vzhled loga ve tvaru G, který se mi opravdu líbí.

V tom všem je cítit duch minimalismu, ale tisk o tom nepsal. Lidé zapomněli, co je skutečný minimalismus. Logo nebylo bezbarvé a vyrobené v jediné podobě, takže nikoho nenapadlo, že je vyrobeno v minimalistickém stylu.

Nové logo bylo jasné a poutavé – při zachování minimalistického vzhledu. Po redesignu lidé kolem nich začali napodobovat Google, jako to dělali dříve v jiných aspektech.

My sami jsme začali používat pro design našich blogů více minimalistický styl.

Jednoduchý obrazový design snadno předá potřebné informace.

Použití GIFů

Každý (no, skoro každý) miluje GIFy. Pomáhají nám v konverzaci, protože někdy dokážou přenést emoce lépe než text.

K jejich přehrávání navíc nejsou potřeba žádné speciální programy. GIFy jsou obvykle malé velikosti a lze je vložit téměř kamkoli.

Jsou lepší než videa a obrázky, zvláště když chcete snížit dobu načítání stránky a provoz. Věřím, že díky jejich všestrannosti jsou GIFy ještě užitečnějším designovým prvkem.

Hrozně rád dávám gify do záhlaví článku. Místo toho, abyste tam vkládali nudný obrázek, věnujte pár minut a vytvořte GIF, jako je tento.

Nemusíte k tomu vyvíjet žádné zvláštní kreativní úsilí, ale rozhodně to přitáhne pozornost k vašemu příspěvku na sociálních sítích. Zde je další dobrý příklad použití GIFů v záhlaví článku.

Dvoubarevné obrázky

Jedná se o kombinaci dvou, obvykle velmi jasných nebo kontrastních barev na jednom obrázku. Chcete-li vytvořit takové obrázky, budete muset zapnout své designérské dovednosti, ale stojí to za to.

Takto krásné dvoubarevné obrázky dokáže vyrobit jen velmi zručný designér. Jsem si jistý, že něco takového nedokážu vytvořit, ale to neznamená, že byste tuto techniku ​​měli ze svých návrhářských plánů vyškrtnout.

Design je proměnlivý. Neustále se vyvíjí, každým rokem se objevují nové trendy, vyvíjejí se nové styly. A to se týká nejen oděvní módy, ale i módy v grafickém designu.
Odborníci analyzovali loga roku 2016 a představili svou vizi toho, co bude populární příští rok.

Minimalismus

Hlavní myšlenkou tohoto stylu je zbavit se všeho nepotřebného a nechat jen to nejnutnější. Minimalismus je populární již několik let a podle našeho názoru neztratí svou pozici ani v roce 2017. Zjednodušení forem, minimum barev a efektů, správné umístění akcentů – to umožňuje logu být moderní a používat ho na různých médiích a platformách.
Rebranding známých společností, které zjednodušily svá loga, jen potvrzuje aktuálnost tohoto trendu.

Stohování dopisů

Složení loga z textových řádků je další jednoduchý způsob, jak vytvořit vizuálně příjemnou a zcela originální kompozici. Styl skládání dopisů se používá, když návrháři potřebují umístit dlouhý text na logo co nejstručněji a nejvýstižněji. V tomto případě může být směr textu buď horizontální, nebo vertikální, často s použitím dalších grafických prvků. Taková loga přitahují pozornost a blokové uspořádání vás nutí číst pomalu a pozorně. Tento trend se objevil v roce 2016 a jeho popularita bude pravděpodobně v roce 2017 poměrně vysoká.

Textová loga

Klasické textové logo je vždy relevantní a překvapivě efektní, což dodnes úspěšně demonstrují silné značky jako Sony, Coca-Cola, Asus, IBM a mnoho dalších. V roce 2016 se designéři zaměřili na použití různých písem s přidáním jednoduchých efektů: stylizace části nápisu, zvýšení nebo snížení vyrovnání párů a kombinování stylů (zejména ručně psaných).

Nápis

Loga vyrobená ve stylu písma vypadají neuvěřitelně elegantně. Tuto metodu samozřejmě nelze nazvat zcela inovativní, ale pro některé kategorie společností a provozoven je nejvhodnější. Nápisy jsou obvykle přijímány hotely, kavárnami a restauracemi, což dává jejich identitě více sofistikovanosti a profesionality. Vzhledem ke své povaze win-win bude tento typ typografie relevantní i v roce 2017.

Design bytu

Stejně jako minimalismus je i tento styl poměrně oblíbený díky své čistotě a estetice bez zbytečných komplikací. Vezměte prosím na vědomí, že plochý design vzbuzuje pocit jasnosti a pohodlí.
Minimalistická a úhledná vizuální řešení namísto 3D objektů s texturami, stíny a přechody jsou skvělým příkladem jednoduchých, ale účinných log.

Spád

Vzhledem k popularitě jednoduchosti musel gradient ztratit půdu pod nohama. Mnoho společností včetně Applu mu však zajistilo úspěšný návrat. Ale je třeba poznamenat, že použití přechodů v grafickém designu doznalo významných změn. Hlavní myšlenka použití tohoto stylu dnes spočívá ve stejné jednoduchosti. Jestliže dříve hýřily barvami a odstíny, odvážné kombinace byly hlavním způsobem, jak přidat hloubku a objem, nyní se ke stejnému účelu používají tlumené tóny, palety plochých a materiálových provedení.

Kresba tužkou

Minimalismus je mnohostranný. Jedním z jeho projevů jsou jednoduché ilustrace, které tak milují designéři ikon a log. Zvláště taková velmi odvážná technika, jako je čárová grafika. Jeho myšlenkou je vytvářet konzistentní obrazy pomocí souvislé linie jedné barvy, obvykle tmavých odstínů. Mimochodem, je to skvělý způsob, jak spojit text a obrázky do jednoho celku.

Šablonová typografie

Šablonová typografie vypadá na logu velmi atraktivně. Navíc existuje tolik variací „na téma“, že najít způsob, jak tuto techniku ​​uplatnit ve svém oboru, není těžké. Vizuální hierarchie dělá logo zapamatovatelným, takže mnoho designérů bude pravděpodobně pokračovat v používání sítotisku v nadcházejícím roce.

Černá a bílá loga

Jedním z nejvíce nekonvenčních přístupů v grafickém designu je použití pouze dvou barev – černé a bílé. Taková loga představují nějaké písmo, doplněné o různé geometrické tvary.
Designéři vždy experimentovali s barevnou složkou loga, nyní však zaznamenáváme trend, kdy celé spektrum barev zcela chybí. Mnozí se proto snaží vytvořit v jejím rámci něco jedinečného – filozofii značky je možné zprostředkovat logem bez použití barevné palety.

Překrývající se přechody

Další trend, který souvisí s gradientem a byl aktivně využíván v roce 2016.
Jeho podstata spočívá v použití jednoduchých geometrických tvarů, které se vzájemně prolínají a vytvářejí jedinečný a nenapodobitelný styl. Overlay jako designová technika vznikla poměrně nedávno a používala se především k tvorbě log v podobě různých zvířat. Postupem času se však rozsah aplikací rozšířil a byl rozpoznán světově proslulými společnostmi. Vzpomeňme na aktualizované logo platebního systému Mastercard – nový život mu vdechl designérský tým z Pentagramu, který upustil od používání stínů a odstranil písmo z hlavního obrázku. V důsledku toho jsme obdrželi jednoduché a zapamatovatelné logo. Překrývající se přechody neustále rostou a pouze nabírají na síle. Můžete tedy směle očekávat, že se příští rok stane jednou z nejoblíbenějších oblastí grafického designu.

Geometrické obrazce

Geometrické téma je v designu žádané již desítky let a v roce 2017 zůstanou jednoduché tvary stále úrodnou půdou pro zamyšlení v oblasti brandingu. Designérům se i nadále daří vytvářet stylová, ale jedinečná loga pomocí jednoduchých geometrických tvarů.

Text v rámečku

Přidání textu do rámečku libovolného tvaru: obdélník, kruh, trojúhelník atd. vám umožní zaměřit pozornost na název společnosti a textovou složku loga. Jednoduchý, ale účinný způsob, jak vytvořit atraktivní logo.

Ručně psaná loga (ručně vyráběná)

Kompozice napodobující ručně kreslené obrázky a prvky jistě zůstanou trendy i v roce 2017.
Vytvořením loga „ručně“ můžete dosáhnout různých efektů, včetně stylizace, aby vypadala jako vintage, grunge nebo dětská kresba. Hlavní výhodou tohoto přístupu je samozřejmě 100% jedinečnost, a tedy i uznání značky.

Negativní prostor

Negativní prostor nás bude i nadále překvapovat. Design je to, co vidíte jako první, ale jakmile k vám design promluví, pochopíte, o čem je. Přesně tak to funguje. Pokud váš návrh dokáže sdělit více, než se na první pohled zdá, stane se o to zvláštnějším. Z tohoto důvodu bude negativní prostor nadále existovat, aby přilákal ještě více lidí, kteří chtějí prozkoumat hloubku tohoto směru v designu.

Všechny výše popsané techniky jsou samozřejmě předpoklady založené na trendech roku 2016. Návrháři v roce 2017 nás jistě potěší novými nápady a vylepšenými stávajícími styly. Buďte kreativní, vytvořte si dokonalé logo! Kdo ví, možná se stanete trendsetterem nového trendu v designu loga?

P.S. Infografiku k tomuto článku si můžete prohlédnout.

Webdesign 2017-2018 | Trendy v moderním designu a vývoji

Článek je rozdělen do dvou hlavních oblastí: grafika ve webdesignu a samotný vývoj a každá sekce má své komponenty.

TRENDY WEBOVÉHO DESIGNU

Začneme tedy trendy webdesignu roku 2017 a tím, co nás čeká v roce 2018. Jaké změny nastaly v grafice, používání fontů, animací a videa a tak dále.

Grafický design

Trend, který je považován za módní, je Flat Design. Pro zdůraznění se používá vektorová grafika s přidáním rastrové grafiky; příklady takových stránek jsou uvedeny níže. Minimalismus a responzivní design, jednoduchý a srozumitelný pro uživatele webu.

Vektorové obrázky

Používání vektoru na webových stránkách se zvyšuje, je lehký, což znamená rychlejší načítání. Vzhledem k tomu, že vektor lze podle potřeby roztahovat a komprimovat, bude vaše grafika vždy vypadat skvěle na jakékoli obrazovce zařízení v jakémkoli rozlišení. Pro vektorové obrázky použijte formát SVG (Scalable Vector Graphics). Většina vektorových editorů umožňuje ukládat v tomto formátu a není potřeba žádný specifický software.

Bezbarvá - duch tlačítka

Posun k minimalismu ovlivnil i design tlačítek. Používání tohoto typu tlačítek v designu webových stránek narůstá. Taková tlačítka nepřetěžují web a vypadají originálně. Naše webové stránky také používají taková tlačítka ve spodní části bloku článků.

Kliknutím na obrázek jej zvětšíte

Velké smysluplné nadpisy a strukturované bloky informací. Typografie se stala opět populární ve webdesignu.

Kliknutím na obrázek jej zvětšíte

Animace, video a interaktivní objekty

Webové stránky začaly používat živé fotografie a pozadí, to rozhodně přitahuje pozornost a dává webu určitou dynamiku. Došlo také k nárůstu používání videa a všech druhů animací pro interakci uživatele.

Komplexní sítě

Koncem roku 2016 se objevil trend pro webové stránky využívající dynamické, složité mřížky se špičkovým designem.

Geometrie v různých podobách

Použití různých typů geometrických tvarů pro text, informační zvýrazněné bloky a pozadí. Obdélníky a čtverce jsou skvělé pro zvýraznění důležitých věcí.

Kliknutím na obrázek jej zvětšíte

Módní barvy

Zde kdo má co rád a co se podle definice hodí pro každý projekt. Jediné, co lze říci, je, že barvy jsou stále živější. V kombinaci a dobrém kontrastu je pro uživatele pohodlnější navigace na webu a vnímání informací.

Bezpodmínečná adaptace

Nyní není třeba říkat, že webové stránky by měly být přátelské k mobilním zařízením. Adaptace je absolutním faktorem moderního webu. Je velmi důležité promyslet design v mobilní verzi tak, aby měl uživatel všechny důležité prvky po ruce a intuitivně rozuměl navigaci na webu.

Spory neutichají, zda je lepší dát ikonu nebo nápis. Výsledky testů na 240 000 uživatelích mobilních zařízení.

Alternativy mobilního menu

Pokud na webu není mnoho sekcí, je lepší použít jako nabídku karty nebo k nim přidat tlačítko na konci v rozbalovací doplňkové nabídce.

Flexibilní dynamické menu

Řešení spočívá v nabídce, která se přizpůsobí šířce obrazovky, zobrazí co nejvíce karet a skryje to, co není zahrnuto pod „Více“.

TRENDY VÝVOJE WEBŮ

Promyšlený design

Na vývoji designu webových stránek by se měl podílet nejen grafik, ale také specialisté na propagaci a marketéři. Umístění každého prvku má svůj účel, pro pohodlný pobyt uživatele.

Méně textu je lepší!

Textová část webu by měla být co nejvíce stručná a měla by odhalovat navrhované téma. Je-li to možné, doplňte jej technickými detaily, jako jsou ceny, vlastnosti atd.