Isinalin namin para sa iyo ang isang kawili-wiling tala ng may-akda ng TheNextWeb na si Amber Lee Turner, na nagsasalita tungkol sa mga pinagmulan ng flat design, kung paano nito binabago ang mga interface ngayon at kung ano ang naghihintay sa flat style sa hinaharap.

Kung medyo interesado ka sa graphic na disenyo, hindi mo maiwasang marinig ang tungkol sa terminong "flat na disenyo". Ang trend na ito ay unang lumitaw sa Internet ilang taon na ang nakalilipas, at sa kani-kanina lang ang flat na disenyo ay nagsimula at naging napakapopular salamat sa malalaking kumpanya na nagsimulang aktibong gumamit ng flat na disenyo.

Ngunit saan nagmula ang flat design na ito? At bakit natin ito nakikita sa Internet? Tulad ng lahat ng bagay sa disenyo, ang pag-alam sa kasaysayan ng estilo ay makakatulong sa iyong gumawa ng mas matalinong mga desisyon kapag gumagamit ng flat na disenyo.

Tingnan natin kung ano ang flat design, ano mga uso sa disenyo mga nakaraang impluwensya sa kanya at alamin kung paano siya naging napakasikat.

Ano ang flat design?

Sa inyo na hindi pamilyar sa kahulugan ng flat design ay dapat malaman na ang flat design ay isang istilo ng disenyo kung saan ang mga elemento ay walang anumang mga tampok na istilo at hindi sila mukhang sagisag ng mga tunay na bagay (tinatawag na skeuomorphism).

Mula sa pananaw ng isang karaniwang tao, ang flat na disenyo ay walang mga elemento tulad ng mga gradient, anino, texture, na nilayon upang gawing mas matingkad at makatotohanan ang mga elemento.

Ngayon, tila ang mga taga-disenyo ay nakikibahagi nang husto sa flat na disenyo dahil ito ay itinuturing na sariwa at moderno at nagbibigay-daan sa iyong tumuon sa kung ano ang pinakamahalaga: nilalaman at mensahe.

Sa pamamagitan ng pag-alis ng lahat ng uri ng estilista, ginagawang mas matibay ng mga taga-disenyo ang kanilang mga proyekto at ngayon ang paggamit ng flat na disenyo ay ang pinakatamang diskarte.

Ngunit hindi ito nangangahulugan na ang iba pang mga estilo ay hindi isinasaalang-alang sa lahat. Kadalasan, upang tukuyin ang kabaligtaran ng flat style, ang terminong "mayaman na disenyo" ay ginagamit, na kung saan ay nailalarawan sa pamamagitan ng pagkakaroon malaking bilang lahat ng uri ng mga dekorasyon - bevel, reflection, anino, gradients. Ginagamit ang “rich design” para gawing mas “tactile” ang mga bagay, na mas maginhawa para sa mga user na nagba-browse sa website at gumagamit ng mga mobile application.

Mahalagang maunawaan na ang "mayaman na disenyo" ay hindi katulad ng skeuomorphism. Ang skeuomorphism ay nagsasangkot ng malay-tao na paggamit ng mga pisikal na analogue ng ilang partikular na elemento (toggle switch, buttons, skin texture, atbp.) upang magmukhang pamilyar ang mga ito sa mga user.

Saan nagmula ang flat design?

Karamihan sa nakikita natin ngayon sa internet o digital world ay nagmula sa print at artistikong mga ninuno. Mahirap sabihin nang eksakto kung kailan nagsimula ang panahon ng flat design at kung saan ang pinagmulan nito, ngunit may ilang malinaw na yugto sa disenyo at sining kung saan nakakuha ng inspirasyon ang flat style.

istilong Swiss

Ang Swiss style (minsan tinatawag na International Typographic Style) ay ang unang flat design inspiration na naiisip, kaya sulit na pag-usapan ang mas detalyado.

Pangunahing nakatuon ang Swiss design sa paggamit ng mga grid guide, sans-serif typography, at isang malinaw na hierarchy ng content at disenyo. Sa panahon ng 40s at 50s, madalas na makikita ang Swiss design sa maraming litrato bilang elemento ng disenyo.

Ang palalimbagan ay isa sa mga pangunahing elemento ng istilong Swiss at dito hindi natin mabibigo na banggitin ang Helvetica typeface, na lumitaw din sa Switzerland noong 1957 at aktibong ginagamit hanggang ngayon.

Ito ay kagiliw-giliw na makita kung paano ginamit ang flat na disenyo bago pa man ito ipinakilala ng Microsoft at Apple sa kanilang mga disenyo at ginawa itong tanyag, dahil ang estilo ng Swiss ay maaaring masubaybayan kahit na sa Germany noong 20s ng ika-20 siglo. Sa oras na iyon, ito ay naging napakapopular at ang mga elemento nito ay ginamit ng sikat na German Bauhaus na paaralan - ang mga mahilig sa sining ay hindi hahayaang magsinungaling na ang Bauhaus ay nagbigay ng maraming diin sa palalimbagan, na may higit na pagkakapareho sa estilo ng Swiss.

Minimalism

Ang isang malaking impluwensya sa flat na disenyo ay matatagpuan din sa kasaysayan ng minimalism. Sa ngayon, ang terminong "minimalism" ay kadalasang ginagamit nang palitan ng flat na disenyo, ngunit ang minimalism ay sikat na bago pa naimbento ang flat design. Ang Minimalism ay may sarili nitong matagal nang tradisyon sa arkitektura, sining, at disenyo.

Ang Minimalism ay may mayamang kasaysayan at mga saklaw iba't ibang uri sining, ngunit kung saan nangingibabaw na ngayon ang patag na disenyo, kadalasang ginagamit ang mga elemento ng minimalism. Mga elemento ng minimalism tulad ng mahigpit mga geometric na hugis, maliliwanag na kulay, ang mga malinaw na linya ay ginagamit din sa flat na disenyo.

Ang isa sa mga pinakatanyag na gawa ng sining sa estilo ng minimalism ay ang pagpipinta na ito ni Yves Klein "Blue Age":

Ligtas na sabihin na ang pinaghalong Swiss style at minimalism ay lubos na nakaimpluwensya sa flat design at sa modernong hitsura ng digital world.

Ang panahon ng flat design mula sa Microsoft at Apple

Nauulit ang kasaysayan at ganoon din ang para sa flat na disenyo. Tulad ng natutunan natin sa itaas, ang mga flat na elemento ay matatagpuan noong 20s ng ika-20 siglo.

Ilang solong designer ang nagtrabaho sa flat design, ngunit ang Microsoft at Apple ang nagpasikat dito. Well, pag-usapan natin sila.

Microsoft at ang Metro interface

Nagsimulang magtrabaho ang Microsoft sa flat design bago pa man lumitaw ang interface ng Metro. Noong kalagitnaan ng 2000s, naglabas ang Microsoft ng isang katunggali sa iPod - ang Zune player (Sigurado akong naaalala pa rin ng ilan sa inyo ang pangalang ito - tala ng editor).

Ang parehong Zune mula sa Microsoft - tingnan ang interface, hindi ba ito nagpapaalala sa iyo ng anuman?

Ito ay sa paglabas ng Zune na isang kakaiba istilo ng taga-disenyo, na nakatuon sa malaking palalimbagan. Disenyo software Ang Zune ay isang matinding pag-alis mula sa karamihan ng mga produkto ng software ng Microsoft noong panahong iyon. Kung tutuusin Windows Phone 7 ay lumabas lamang sa katapusan ng 2010 at ang disenyo ng mobile OS na ito ay kinuha ng marami mula sa interface ng software ng Zune. Malalaki at makulay na mga hugis batay sa mga gabay sa grid, sans serif typography (grotesque), mga flat na icon.

Malapit nang tawagan ng Microsoft ang interface na ito ng Metro

Ang disenyo na ito ay naging napakapopular na ang Microsoft ay naglabas ng Windows 8 desktop OS, na batay sa interface ng Metro. Maaliwalas na mga parisukat na hugis, isang diin sa typography, maliliwanag na kulay - lahat ng ito ay lumipat sa mga personal na computer. Ang parehong interface ay ginagamit sa halos lahat ng mga produkto ng Microsoft, kabilang ang Xbox 360.

Kung paano niyugyog ni Apple ang skeuomorphism

Kahit na ang Microsoft ay nagtatrabaho sa isang patag na interface sa loob ng mahabang panahon, mayroon ding ilang mga trick ang Apple. Sa una, bahagyang ipinahiwatig ng Apple na tatalikuran nito ang skeuomorphism, at sa pag-anunsyo ng iOS 7 noong Hunyo 2013, naging malinaw na ang koponan ng Cupertino ay matatag na nagpasya na gumamit ng flat design.

Dahil maraming tagasunod ang Apple noong panahong iyon, ang paglabas ng "flat" na iOS 7 ay naging mas popular ang istilo ng disenyong ito kaysa dati. At ito ay nangyari sa matinding masikip na mga deadline(ibig sabihin ay isang mabilis na paglipat mula sa iOS 6 hanggang iOS 7 - tala ng editor).

Ang aesthetic ng disenyo ng Apple ay lubos na nakaimpluwensya sa disenyo ng mga mobile application at website, dahil sa wakas ay itinuturing ng karamihan sa mga designer ang istilong ito bilang ang pinakamoderno at naaangkop. Nang lumipat ang Apple sa isang flat na istilo, ang skeuomorphism ay agad na naging luma at ang malaking bilang ng mga site at application ay agad na nangangailangan ng muling pagdidisenyo.

Malinaw itong makikita sa mga mobile application, na seryosong nagbago ng kanilang disenyo at interface upang matugunan ang mga pamantayan ng iOS 7. At ito ay nagbigay-daan sa mga user na masanay sa flat iOS 7 nang medyo mabilis.

Tumutugon na Disenyo

Dapat ding tandaan na ang isa sa mga dahilan kung bakit naging napakapopular ang flat design ay dahil sa tinatawag na "responsive design." Sa pag-unlad ng mga teknolohiya sa Internet, ang mga gumagamit ng iba't ibang mga aparato ay nagsimulang mag-access sa Internet - at pangunahin mula sa mga mobile device. Pinilit nito ang mga designer na gumamit ng tumutugon na disenyo upang ang mga site ay magmukhang parehong maganda sa ganap na mga computer at sa mga smartphone at tablet. At ang mga taga-disenyo ay gumamit ng maraming "flat" na elemento sa pagbuo ng mga tumutugon na website.

Ang flat style ay nagbibigay-daan sa disenyo ng web na maging mas mahusay. Nang walang mga hindi kinakailangang elemento ng interface, ang mga site ay naglo-load nang mas mabilis, na nagbibigay sa user ng pagkakataong tumuon sa nilalaman.

Tama rin ito sa trend ng pagtaas ng mga resolution ng screen mga mobile device. Mas madaling magpakita ng malinis, simpleng mga hugis at typography kaysa sa pag-upload ng mabibigat na larawan sa bawat oras na iba ang hitsura sa iba't ibang mga resolution ng screen.

Ang hinaharap ng flat na disenyo

Siyempre, wala kaming glass ball na hinuhulaan ang hinaharap, ngunit malinaw na ang flat na disenyo, tulad ng lahat ng iba pa, ay hindi magtatagal magpakailanman at papalitan ng ibang istilo. Pagkatapos ng lahat, ang flat na disenyo ay may malinaw na mga disadvantages at ang mga designer ay patuloy na mag-eksperimento, na sa huli ay hahantong sa paglitaw ng isang bagong dominanteng istilo na mag-iiwan ng flat na disenyo sa malayong nakaraan.

Sa bagay na ito, ito ay kagiliw-giliw na obserbahan kung ano gawaing disenyo ay kasalukuyang ginagawa sa Google. Sa isang banda, maraming mga flat na elemento sa kanilang mga application, ngunit hindi inabandona ng Google ang maraming skeuomorphic na elemento - halimbawa, gumagamit pa rin sila ng mga anino. Tila, nais ng "magandang korporasyon" na kunin ang pinakamahusay mula sa bawat isa sa mga estilo at lumikha ng sarili nitong natatanging istilo.

Sa ngayon, ang flat na disenyo ay itinuturing na kapana-panabik uso sa fashion, at ito ay tiyak na isang mahalagang milestone sa kasaysayan ng disenyo. Ngunit huwag kalimutan na sa maraming paraan, ang flat design ay ang reincarnation lamang ng Swiss style at minimalism sa bagong digital world.

Marahil ay narinig mo na ang katagang "minimalism" dito at doon, lalo na nitong mga nakaraang taon, ngunit ano nga ba ito at paano natin ito masusulit?

Ang minimalism ay maaaring inilarawan bilang pag-aalis ng lahat ng hindi kinakailangang elemento at pagtutuon ng pansin sa kung ano ang kinakailangan. Dahil dito, ang minimalism ay umaakit ng tagumpay.

Habang ang minimalism ay madalas na simple sa labas, maraming pag-iisip, pagsasanay at oras ang napupunta sa paglikha at pagdidisenyo ng isang minimalist na bagay. Kaya, narito ang ilang mga paraan na maaari mong gamitin upang maging minimalist.

1. Makamit ang pagkakapare-pareho

Ang isang minimalist na logo ay maaaring maging lubhang kapaki-pakinabang pagdating sa paglikha ng pagkakakilanlan ng tatak. Gamitin ang disenyo ng bar na ito mula kay Simon McWhinney bilang isang halimbawa. Sa pamamagitan ng pagpapanatiling napakasimple ng logo at minimal ang paleta ng kulay, nagiging sapat na flexible ang disenyo para magamit sa lahat ng corporate media nang maayos, na lumilikha ng pare-pareho at napaka-memorable na brand.

2.I-explore ang mga nakatagong koneksyon

Ang pagiging minimalist ay hindi nangangahulugan na ang iyong disenyo ay kailangang maging mas malikhain. Sa katunayan, kapag hindi ka nababagabag sa mga detalye, madalas kang nagkakaroon ng pagkakataong galugarin at paglaruan ang matatalinong relasyon na nakatago sa iyong disenyo. Tingnan ang branding na ginawa ng Interband para sa Australian Opera, ang minimalist na disenyo ay nag-explore sa pinag-isipang mabuti na koneksyon sa pagitan ng mga salitang "OPERA", "OPERA AUSTRALIA" at "OZ OPERA".

3. Maglaro ng mga spatial na relasyon

Ang minimalism ay maaaring magbigay-daan sa iyo na isaalang-alang ang mga spatial na relasyon sa iyong disenyo sa mga paraang hindi mo pa nakikita noon. Isaalang-alang kung paano nakikipag-ugnayan ang iyong disenyo sa iba pang mga elemento upang lumikha ng mas malaking disenyo, tulad ng isa sa mga ito mga business card, dinisenyo ni Trevor Finnegan, pumila.

4. Maging matalino

Ang minimalism ay hindi nangangahulugan ng kawalan ng mga elemento ng paglalarawan, ngunit sa halip ay ang maingat na pagpili kung kailan at saan gagamitin ang mga ito. Sa pamamagitan ng pagtatrabaho sa mga elementong naglalarawan na ginagawang logo ang pangalan ng kumpanya, katulad ng ginawa ng Frame Creative sa pagba-brand na ito, maaari kang lumikha ng isang napaka-visual at napaka-minimalis na disenyo.

5. Gumamit ng katumpakan

Ang minimalism ay kadalasang tungkol sa pag-alis ng lahat ng hindi kinakailangang bagay at pagtutok sa komunikasyon. Tingnan kung paano idinisenyo ang mga business card na ito mula kay Jake Frey, na nagpapakita ng kanyang impormasyon sa pakikipag-ugnayan nang maayos at tumpak, nang hindi nangangailangan ng mga magarbong visual.

6. Gumamit ng modular grid

Tulad ng alam mo na, ang mga grids ay lubhang kapaki-pakinabang (maaaring sabihin ng ilan na mahalaga) para sa maraming uri ng disenyo, at ito ay totoo lalo na para sa minimalism. Kung wala kang maraming elemento sa iyong disenyo, ito ay isang magandang pagkakataon upang maglaro sa iyong modular grid. Pansinin ang makabagong disenyong ito mula kay Jessica Giboine, na gumagamit ng grid layout upang lumikha ng isang malakas na pakiramdam ng disiplinadong kopya ng mga bloke ng teksto na may mga heading at graphic na elemento, na bumubuo ng malinis, simple at epektibong disenyo.

7. Makamit natin ang functionality

Ang minimalism ay maaaring maging mahusay para sa pag-andar. Ang isang maayos, malinaw, at hindi kalat na disenyo ay maaaring magsilbi bilang madaling pag-navigate, tulad ng sa disenyo ng pahina ng nilalaman ni James Cape. Ang minimalistang disenyo at malinaw na typographic hierarchy ay ginagawang mabilis, simple at functional ang pag-navigate sa nilalaman ng pahina.

8. Hanapin ang iyong balanse

Ang ugnayan sa pagitan ng mga visual na elemento tulad ng mga larawan at typographic na mga elemento ay mahalaga sa pagkuha ng tama. Ang mahusay na disenyo ay madalas na nag-iingat upang matiyak na walang elementong nangunguna sa iba nang walang magandang dahilan. Sa halimbawang post na ito mula sa Mother Design, higit pa mga simpleng larawan ay nakaayos na may malaki, nagbibigay-kaalaman na dami ng teksto, habang ang puno, malalaking larawan ay ipinares sa maliliit na bloke ng teksto, sa gayon ay lumilikha ng balanse at pagkakatugma sa pagitan ng mga pahina.

9. Lumabag sa ilang mga patakaran

Gaya ng nabanggit, ang minimalism ay nagbibigay sa iyo ng isang espesyal na pagkakataong mag-eksperimento sa iyong disenyo sa mga paraang hindi mo pa nakikita noon, at kung minsan ay nangangahulugan iyon ng bahagyang pagyuko sa mga panuntunan. Kunin ang logo na ito mula kay Rabbi White bilang isang halimbawa, sa pamamagitan ng pagpapakita ng kalahati ng logo na nakabaligtad bilang medyo kahanga-hangang disenyo, lumilikha ito ng isang bagay na sa anumang iba pang halimbawa ay mukhang hindi nababasa. Ngunit salamat sa hindi kapani-paniwalang pagiging simple at minimalist na katangian ng tatak, ang nakatutuwang solusyon na ito ay talagang mahusay na gumagana bilang isang visual na elemento.

10. I-visualize ang iyong font

Ang uri ay isang mahalagang sandata na hindi dapat kalimutan, lalo na pagdating sa minimalism. Maaari itong kumilos bilang isang visual na elemento, lalo na kapag ito ay bahagyang binago upang umangkop sa sitwasyon, katulad ng bukas na pagkalat mula sa Italian Vogue. Ang paggawa ng font na parang water ripples ay lumilikha ng isang malakas visual effect nang hindi gumagamit ng anumang mga larawan, pinananatiling simple at maayos ang panghuling disenyo.

11. Ang puting espasyo ay ang tamang espasyo

Ang puting espasyo, na kilala rin bilang "negatibong espasyo," ay maaaring magmukhang walang laman na espasyo sa papel, ngunit hindi iyon ganap na totoo! Kapag ginamit nang tama, makakatulong ang white space na balansehin ang iyong disenyo, alisin ang pagsisikip, at tulungan itong huminga. Tingnan ang halimbawang ito ng isang disenyo ng libro mula sa Studioahamed kung saan ang ideya ng white space ay kinuha bilang panimulang punto at ginamit nang lubusan, na nagreresulta sa isang klasiko, minimalist na disenyo.

12. Galugarin ang iyong mga pagpipilian

Ano ang mas minimal kaysa sa isang all-white palette? Ang disenyo ay hindi dapat limitado sa screen ng monitor gamit din ito kapag ang produkto ay napupunta sa pag-print, maaari mo itong bigyan ng kakaibang lasa at pagkakaiba mula sa lahat ng iba pa. Sa pamamagitan ng pagsasama ng text printing o embossing effect, ang iyong mga naka-print na produkto ay maaaring umakma at magpapalalim ng isang minimalist na disenyo, tulad ng ipinapakita sa halimbawang ito mula kay Adam Buente.

13. Teksto

Kapag nag-aaral ng minimalism, madaling makita na, bilang isang pangkalahatang tuntunin, upang maging minimalist ay dapat gumamit ka ng flat-panel printing, ngunit hindi ito mahigpit na kinakailangan. Ang pagdaragdag ng texture sa iyong disenyo ay maaaring magdagdag ng lalim at pagiging epektibo sa iyong mga hangarin nang hindi lumalampas sa minimalism. Tiyak na gumagana nang maayos ang texture kapag ito ay balanse sa maayos at nakapapawing pagod na mga kulay, tulad ng halimbawa ng website/branding sa itaas mula sa Watts Design, na gumagamit ng texture nang balanse sa simpleng photography at pagba-brand upang lumikha ng napakaepektibong disenyo.

14. Mag-isip sa labas ng kahon

Medyo literal. Ang minimalism ay maaaring magpapahintulot sa iyo na maging mas mapaglaro sa paglalagay at komposisyon ng iyong mga elemento, tulad ng ipinapakita sa post na ito mula kay Gregmadeit. Ang paglalagay ng uri sa gilid ng page ay lumilikha ng kakaibang epekto na kapansin-pansin nang hindi nakompromiso ang pagiging madaling mabasa ng teksto.

15. Maging bukas

Kapag mayroon kang ilang elemento na nakikipaglaban upang makita, kailangan mong maging mas bukas sa iyong mensahe at pangkalahatang komunikasyon. Ito ay lalong makapangyarihan pagdating sa disenyo ng web, kapag lahat tayo ay nag-log in at nagba-browse ng mga pahina, isang simpleng mensahe na may gabay sa pagkilos, tulad ng ipinapakita sa website ng Nine Sixty, ay nakakatulong na bigyan ang mambabasa ng ideya kung sino sila sa iyo sa mismong sandaling iyon.

16. Gumamit ng iskala

Gamit ang minimalism, dapat mong sabihin nang may katumpakan kung ano ang unang itutuon ng mga mata ng iyong madla, at isang paraan upang makamit ito ay ang sukat. Tingnan ang mga elemento sa pagkalat mula sa Saturdays Magazine, ang mata ay agad na napupunta sa malaking elemento: quote sa kanang pahina, pagkatapos ay sa larawan, pagkatapos ay sa teksto. Ang isang simpleng disenyo na naka-scale lang ay makakatulong sa iyong idikta ang tamang pagkakasunud-sunod ng pagbabasa para sa iyong madla.

17. Hindi lahat ay black and white

Maraming mga tao ang naniniwala na ang mga monochromatic color palettes ay ang lahat na ginagamit sa minimalism, ngunit ito ay hindi ganap na totoo. Maaaring gamitin ang kulay upang lumikha ng isang kapansin-pansing disenyo nang hindi lalampas sa minimalism, hangga't ang palette ay nananatiling napakaliit (1-3 kulay ang pinakamahusay). Tingnan ang halimbawang ito mula sa Moruba, kung saan ang maliwanag na dilaw na sinamahan ng isang malinaw na itim at puting logo ay nagtutulungan upang makagawa ng isang tunay na matagumpay at kapansin-pansin (habang minimalist pa rin) na disenyo.

18. Maging mas aktibo

Makakatulong talaga ang minimalistang disenyo na mapataas ang pagkalikido ng iyong mga ideya, lalo na sa praktikal na gamit. Halimbawa, ang branding na ito mula sa Buro Ufho ay binubuo ng isang simpleng logo na may serif font at dalawang bloke ng color fill. Ang kapansin-pansing pagba-brand na ito ay mayroon mataas na antas kakayahang umangkop sa loob ng paleta ng kulay nito; Ang kulay ng mga diagonal na bloke ay madaling mabago nang hindi nawawala ang alinman sa mga tampok na lagda, lahat salamat sa simple ngunit kakaibang minimalist na disenyo.

19. Gumamit ng simbolismo

Ang minimalism ay isang magandang pagkakataon para sa iyo na tuklasin ang lalim ng simbolismo sa iyong disenyo. Subukan at isipin ang tungkol sa bagay, tungkol sa mga bagay na nauugnay dito, tungkol sa kung bakit ginawa ang bagay. Halimbawa, ang disenyo ng pabalat ni Jennifer Carrow modernong aklat“Laban sa Kaligayahan.” Sa pamamagitan ng pagbabago ng font sa isang malungkot na simbolo ng mukha, makakakuha ka ng isang matalino at hindi malilimutang disenyo.

20. Ikonograpiya

Ang mga icon ay kapaki-pakinabang na maliliit na icon na ginagamit ng karamihan sa atin araw-araw, mula sa mga icon ng application hanggang sa mga icon sa taskbar ng computer. Mabisang magagamit ang mga icon sa mundo ng minimalism. Mapapahusay nila ang pagiging naa-access, bawasan ang dami ng text o mga font na mayroon ka sa iyong page, at tulungan ang iba pang mga user na makita ang iyong disenyo nang biswal. Tingnan kung paano gumagamit ang website na ito mula sa Spab Rice ng mga icon sa page upang tumulong sa pag-navigate at ipaliwanag ang kanilang nilalaman.

21. Mag-isip sa typographically

Mas kaunti ang higit pa, lalo na pagdating sa minimalist na typography. Ang paggamit ng 1-3 font ay ang iyong pinakamahusay na pagkakataon sa pagdidisenyo ng isang minimalist at functional na disenyo, tulad ng ginawa sa halimbawa ng Kalpakian. Ang kaunting paggamit ng mga background at katamtamang paggamit ng mga font ay lumilikha ng pagiging madaling mabasa

22. Maliit na pagbabago. Malaking gantimpala

Ang kagandahan ng minimalism sa katunayan ay ang maliliit na pagbabago ay maaaring magbunga ng malalaking resulta. Kunin, halimbawa, ang logo para sa The Pines. Ang isang simpleng nakakatakot na font na sinamahan ng dalawang guhit lamang ay lumilikha ng isang maliit ngunit magandang visual effect na hindi nakakasira sa pagka-orihinal o minimalism ng logo.

23. Pokus

Huwag kalimutan kung bakit ka nagsimulang magdisenyo: nilalaman. Napakahusay na gumagana ang minimalism kapag nagpapakita ito ng nilalaman simpleng disenyo, na nagpapahintulot sa atensyon ng manonood na agad na lumipat sa nilalaman ng pahina, sa halip na hitsura. Tingnan kung paano hinahayaan lang ng minimalist na disenyo ng web page ni Darrin Higgins ang content na maging pokus.

24. Contrast

Ang pagdidisenyo na may mataas na contrast ay makakatulong na dalhin ang iyong mga visual na elemento at nilalaman sa harapan at gumawa ng isang madaling maunawaan na disenyo. Sa halimbawang ito, ang isang pahina mula sa Mads Burcharth, ang itim na background ng pahina ay kaibahan sa mayamang kulay ng mga larawan ng nilalaman, na lumilikha ng isang simple ngunit kaakit-akit na disenyo.

25. Disenyo para sa hinaharap

Ang minimalism ay maaaring maging isang mahalagang bahagi sa iyong disenyo dahil ito ay may potensyal na maging walang tiyak na oras. Ang mas kaunting mga elemento na kasama sa iyong disenyo, mas maliit ang posibilidad na ang mga ito ay mawawala sa istilo o maging hindi nauugnay. Ang isang sikat at mahusay na halimbawa nito ay ang Google. Tingnan ang mga screenshot ng Google page 10 taon na ang nakakaraan at ngayon. Ang mga banayad na pagbabagong ginawa, mga puting espasyo, nakatutok sa nilalaman at minimalism ng website ay nagpapanatili sa disenyong ito na walang tiyak na oras.

Upang tapusin ang nasa itaas, ang minimalism ay hindi isang kinakailangang aesthetic na paksa o estilo na maaari mong muling likhain, ngunit isang paraan ng pag-iisip tungkol sa iyong disenyo.

Sa palalimbagan, subukang limitahan ang iyong paggamit ng mga font upang lumikha ng isang mas magkakaugnay at hindi gaanong nakakalito na disenyo. Bigyan ng kahalagahan ang iyong paggamit ng mga vertical system at layout sa loob ng sheet para sa mas madaling mabasa.

Sa wika ng kulay, gumamit ng mga monochromatic scheme sa lahat ng kanilang anyo, ngunit huwag pakiramdam na limitado ng mga ito. Sa ilang partikular na sitwasyon, ang pagdaragdag ng kulay dito at doon ay talagang makakatulong na i-highlight ang mga pangunahing punto ng iyong disenyo at gumuhit ng focal point para sa mahahalagang elemento.

Panghuli, subukang magpasya kung ano ang maaaring alisin, kung ito ay isang kulay mula sa iyong palette o isang imahe mula sa iyong komposisyon. Magpasya kung ano ang maaaring putulin, kung ano ang maaaring palitan ng isang bagay na mas maigsi. Burahin mo na lang hangga't kaya mo hanggang sa kung ano na lang talaga ang kailangan.

Ang isang maginhawa at kaakit-akit na website ay ang pangunahing tuntunin ng modernong disenyo ng web. makamit magandang resulta nagbibigay-daan sa paggamit ng mga prinsipyo ng minimalism.

Sa artikulong ito ay pag-uusapan natin ang minimalism sa disenyo ng web, kung paano ilapat ito nang tama, kung ano ang kailangang isaalang-alang kapag bumubuo ng mga minimalistic na interface, at ipaliwanag din kung bakit kung minsan ay "mas kaunti ay higit pa."

Minimalist Design: Isang Maikling Kasaysayan

Ang ilang mga web designer ay nagkakamali sa pag-iisip ng minimalism bilang isang aesthetic na pagpipilian. Upang maiwasan ang bitag na ito, linawin natin ang mga ugat ng kilusang ito.

Bagaman ito ay sapat na para sa disenyo bagong uso, ang mga pangunahing ideya nito ay umiral nang mahabang panahon. Kapag tinatalakay ang minimalist na disenyo, naiisip kaagad ng isa ang tradisyonal na kultura ng Hapon, na pinahahalagahan ang balanse at pagiging simple. Japanese architecture, interior design, art at graphic na disenyo isama ang minimalism.

"hangin ng tagumpay. Clear Day” ng Japanese artist na si Katsushika Hokusai (1830). Ang paggamit ng mga simpleng kulay ay lumilikha ng pakiramdam ng kapayapaan

Bilang isang kilusang Kanluranin, nagsimula ang minimalism noong unang bahagi ng ika-20 siglo. Naimpluwensyahan ng pagpapatupad modernong materyales, tulad ng salamin at bakal, maraming arkitekto ang nagsimulang gumamit ng mga minimalistang disenyo sa kanilang mga gusali. Si Ludwig Mies van der Rohe, isang German-American architect, ay isa sa mga pioneer ng minimalist na kilusan. Siya ay kredito sa unang aplikasyon ng pariralang "mas kaunti ay higit pa" sa disenyo ng arkitektura.

Ang German Pavilion sa Barcelona, ​​​​ginawa ni Ludwig Mies van der Rohe noong 1929

Ang konsepto ng "mas kaunti ay higit pa" ay lumipat mula sa arkitektura patungo sa iba pang mga sining at industriya: panloob at pang-industriya na disenyo, pagpipinta at musika. Bilang direksyon visual na disenyo naging tanyag ang minimalism noong 1960s nang lumipat ang mga artista patungo sa geometric abstraction sa pagpipinta at eskultura. Ang artistikong kilusan ay natagpuang ekspresyon sa mga akdang nauugnay sa paaralan ng Bauhaus. Isa sa mga sikat na minimalist na artista na nakaimpluwensya sa kilusan ay si Donald Judd, na ang mga gawa ay puno mga simpleng hugis at mga kumbinasyon ng kulay.

Sa iba't ibang larangan ng pinong sining, ang pangunahing prinsipyo ng minimalism ay nag-iwan lamang ng mahalagang bahagi ng pag-andar upang ituon ang atensyon ng tatanggap at pati na rin mapahusay ang pangkalahatang kagandahan. Tulad ng sinabi ni Donald Judd: " Hugis, lakas ng tunog, kulay, ibabaw - ito ay isang bagay sa sarili nito. Hindi ito maitatago bilang bahagi ng isang ganap na naiibang kabuuan. Ang mga anyo at materyales ay hindi dapat magbago depende sa kanilang konteksto».

Sa kanyang trabaho, hinahangad ni Judd ang awtonomiya at kalinawan para sa itinayong bagay at ang puwang na nilikha nito.

Ano ang "minimalist web design"?

Ngayon, ang minimalism ay umuusbong bilang isang makapangyarihang pamamaraan sa modernong disenyo ng web. Naging tanyag ito bilang isang reaksyon sa trend patungo sa pagtaas ng pagiging kumplikado sa disenyo. Ang pagiging kumplikado ng visual ay ipinakita na makakaapekto sa karanasan ng gumagamit ng isang site: kung mas maraming elemento ang nasa isang disenyo, mas magiging kumplikado ito sa user. Sa tamang paggamit Ang minimalism ay makakatulong sa amin na ituon ang aming mga disenyo sa pagpapasimple sa mga gawain ng user. Iminumungkahi ng isang pag-aaral ng EyeQuant na ang malinis na disenyo ay nagreresulta sa mas mababang bounce rate. Ang minimalism ay nagdulot ng karagdagang mga benepisyo sa mga website tulad ng mas mabilis na paglo-load at mas mahusay na pagkakatugma Sa iba't ibang laki screen.

Marahil ang isa sa mga pinakatanyag na halimbawa ng minimalism sa disenyo ng web ay ang Google Search. Inuna ng Google ang pagiging simple ng mga interface nito mula noong nag-aalok ito ng beta noong 1990s. Ang home page ay ganap na idinisenyo sa paligid ng isang sentral na function ng paghahanap. Lahat ng hindi gumagana para sa pagba-brand ay aalisin.

Ang home page ng Google ay hindi masyadong nagbago sa loob ng 15 taon

Ang prinsipyo ng pagiging simple ay maaaring humantong sa maling paniniwala na ang minimalism ay madaling ipatupad, ngunit sa katotohanan ay nangangahulugan ito ng higit pa sa "mas mababa." Tukuyin natin ang mga katangian ng minimalism.

Mahalaga lang

Ang isang minimalist na diskarte sa disenyo ng web ay ang pasimplehin ang mga interface sa pamamagitan ng pag-alis ng mga elemento at content na hindi sumusuporta sa mga gawain ng user. Upang lumikha ng isang tunay na minimalistic na interface, ang taga-disenyo ay kailangang mahigpit na ayusin ang mga elemento, na nagpapakita lamang ng pinakamahalaga at itapon ang anumang bagay na nakakagambala sa mga gumagamit mula sa pangunahing bagay (halimbawa, hindi kinakailangang dekorasyon). Ang bawat elemento sa isang disenyo, imahe man o teksto, ay may layunin; hindi ito dapat gamitin maliban kung ito ay nagdaragdag ng karagdagang kalinawan sa mensahe.

Kasabay nito, siguraduhin na sa pamamagitan ng pag-alis o pagtatago ng hindi kinakailangang nilalaman, hindi mo mahahadlangan ang mga pangunahing gawain ng user. Ang ideya ay gawing malinaw ang mensahe sa halip na itago. Kaya, magdisenyo sa paligid ng nilalaman at mag-iwan ng sapat na nakikitang mga elemento (tulad ng pangunahing nabigasyon) upang maiwasang mawala ang mga user.

Negatibong espasyo

Hindi nakakagulat na ang pinakakaraniwang elemento ng minimalism ay ang kawalan ng mga elemento. Ang Negative/White Space ay isang natatanging katangian ng minimalism; Ang negatibong espasyo ay ang walang laman na espasyo sa pagitan ng mga visual na elemento. Ang pagkakaroon ng walang laman na espasyo ay nangangahulugan ng higit na diin sa mga elementong naroroon. Sa kultura ng Hapon, mayroong "prinsipyo ng ma": ang espasyo sa pagitan ng mga bagay ay nakikita bilang isang paraan ng pagbibigay-diin sa halaga ng mga bagay na ito.

Bagama't madalas na tinatawag na puti ang negatibong espasyo, hindi kailangang ganoon ang kulay. Ang ilang mga site ay gumagamit ng buong kulay na mga background.

Ang pangunahing elemento ng disenyo na nauugnay sa minimalism sa isipan ng karamihan ng mga tao ay negatibong espasyo.

Mga katangiang biswal

Sa minimalist na disenyo, mahalaga ang bawat detalye. Napakahalaga ng iyong napagpasyahan na panatilihin.

Flat na texture

Ang minimalism ay madalas na gumagamit ng mga flat texture, icon at graphic na elemento. Ang mga flat interface ay hindi gumagamit ng mga halatang lighting effect, mga anino, mga gradient, o iba pang mga uri ng mga texture na maaaring magmukhang makintab o 3D ang mga elemento.

Minimalistic visual hierarchy na may diin sa mga flat na elemento interface, medyo karaniwan sa mga modernong website

Mga kaakit-akit na larawan at mga guhit

Ang mga imahe ay ang pinakakilalang anyo ng sining na ginagamit sa minimalist na disenyo. Nagbibigay sila ng mga emosyonal na koneksyon at lumikha ng isang espesyal na kapaligiran. Ngunit ang photography o ilustrasyon ay dapat sundin ang mga prinsipyo ng minimalism. Ang maling imahe (isang larawan na may napakaraming detalye o nakakagambalang elemento) ay magpapawalang-bisa sa mga benepisyo ng nakapalibot na minimalistic na interface at sisira sa integridad ng istraktura.

Ang lahat ng mga katangian ng minimalism ay dapat ipahayag sa mga imahe

Limitadong scheme ng kulay

Malaki ang papel na ginagampanan ng kulay sa disenyo ng web dahil may kakayahan itong magtatag ng parehong impormasyon at emosyonal na koneksyon sa pagitan ng produkto at ng user. Ang kulay ay maaaring lumikha ng visual na interes o mag-utos ng atensyon nang hindi nangangailangan ng anuman karagdagang elemento disenyo o graphics. Ang mga taga-disenyo na nagsusumikap para sa minimalism ay may posibilidad na masulit ang ilang mga napiling kulay at kadalasan ay gumagamit lamang ng isang kulay (isang monochrome na scheme ng kulay).

Sa pagbaba ng papasok na visual na impormasyon paleta ng kulay nagiging mas nakikita at tumataas ang epekto nito sa user

Epektibong palalimbagan

Bukod sa kulay, isa pang pangunahing visual na elemento ay typography. Ang naka-bold na font ay agad na nakatuon ng pansin sa mga salita at nilalaman, na tumutulong na lumikha ng isang kaakit-akit na visual effect.

Gumamit ng typography upang ihatid ang kahulugan at lumikha ng visual na interes

Contrast

Dahil ang layunin ng minimalist na disenyo ay kadalian ng paggamit, mga high-contrast na tela mga graphic na elemento maaaring meron magandang pagpipilian. Maaaring idirekta ng mataas na contrast ang atensyon ng user sa mahahalagang elemento at gawing mas nababasa ang teksto.

Kadalasan, ang mga minimalistang disenyo ay gumagamit lamang ng isang kulay bilang tuldik, na nagha-highlight sa pinakamahalagang elemento ng pahina.

Pinakamahusay na mga halimbawa

Dahil ang minimalist na disenyo ay nangangailangan ng parehong antas ng kalinawan at functionality gaya ng "normal" na disenyo, ngunit may mas kaunting elemento, nagdudulot ito ng ilang hamon para sa mga developer.

Makamit ang pagkakaroon ng isang compositional center

Ang pilosopiya ng minimalism ay nakasentro sa ideya ng pagdidisenyo sa paligid ng nilalaman: ang nilalaman ay hari at ang visual na istraktura ay dapat na mapansin. magandang background para sa kanya. Ang layunin ay gawing mas malinaw ang mensahe hindi lamang sa pamamagitan ng pag-aalis ng mga abala, kundi pati na rin sa pamamagitan ng pagtuon sa kung ano ang mahalaga. Sa kasong ito, ang isang malakas na focal area ay nagiging lalong mahalaga.

Sundin ang panuntunang "isang konsepto sa bawat pahina" at isentro ito sa isang visual na medium

Lumikha ng matataas na inaasahan gamit ang tuktok ng screen

Ang isang lugar sa page na nakikita bago ang anumang aksyon ay hinihikayat ang mga user na galugarin pa ang site. Upang matiyak na mangyayari ito, kailangan mong magbigay ng kawili-wili, nakakaintriga na nilalaman. Maglagay ng makabuluhang nilalaman sa tuktok ng screen na may maraming puting espasyo sa paligid nito, pagkatapos ay magdagdag ng higit pang nilalaman sa pahina habang nag-i-scroll ka pababa.

Ito ang hitsura ng home page ng website ng Apple sa itaas ng fold line.

Sumulat ng mga maiikling teksto

Alisin ang mga hindi kinakailangang bagay. Ang iyong teksto ay dapat na naglalaman lamang ng kaunting mga salita na kinakailangan upang sapat na maihatid ang iyong mensahe.

Alisin ang lahat ng hindi kinakailangang salita.

Pasimplehin ang nabigasyon (ngunit huwag itago)

Ang minimalism ay dapat na simple. Ang isang bagay na nagpapasimple sa karanasan ng gumagamit ay ang kakayahang pangasiwaan ang mga gawain nang madali at walang putol. Ang pinakanag-aambag na salik dito ay ang intuitive navigation. Ngunit ang pag-navigate sa isang minimalistic na interface ay nagdudulot ng malubhang problema: sa pagtatangkang alisin ang lahat ng hindi kinakailangang elemento at ayusin ang nilalaman, bahagyang o ganap na itinago ng mga developer ang nabigasyon. Lumalawak ang icon ng menu buong listahan Ang mga puntos ay nananatiling popular na pagpipilian para sa maraming mga propesyonal, lalo na sa minimalist na disenyo ng web at mga mobile user interface (UI). Madalas itong nagreresulta sa mababang pagkatuklas ng mga elemento ng nabigasyon. Kunin ang nakatagong nabigasyon ng site na ito:

Kadalasan, ang simple, minimalistic na mga user interface ay may nakatagong kumplikado. Sa kasong ito, ang pangunahing mga pagpipilian sa nabigasyon ay nakatago bilang default

Ihambing sa palaging magagamit na nabigasyon ng site na ito:

Sa karamihan ng mga kaso, ang palaging nakikitang nabigasyon ay mas mahusay para sa mga user.

Tandaan na ang madaling pag-navigate ay palaging isa sa mga pangunahing layunin ng disenyo ng web. Kung gumagawa ka ng mga minimalist na website, tiyaking madaling mahanap ng mga bisita ang kailangan nila.

Gumamit ng functional animation

Tulad ng anumang iba pang elemento, dapat sundin ng animation ang mga prinsipyo ng minimalism: dapat itong ipakilala nang banayad at kung kinakailangan lamang. Magandang animation may kahulugan at functionality. Halimbawa, maaari mong gamitin ang animation upang makatipid ng espasyo sa screen (sa pamamagitan ng pagpapakita ng mga nakatagong detalye sa hover). Ang animation sa halimbawa sa ibaba ay nagdaragdag ng elemento ng kakayahang matuklasan at ginagawang mas kawili-wili ang isang karaniwang gawain:

Ginagawang mas dynamic ng animation ang pakikipag-ugnayan sa site.

Gumamit ng minimalism sa mga landing page at portfolio

Bagama't ang pangkalahatang pilosopiya ng minimalist, disenyong nakatuon sa nilalaman ay nalalapat sa bawat website, kung minsan ang aesthetic ay maaaring hindi naaangkop. Ang minimalism ay angkop para sa paglikha ng mga portfolio website at mga landing page na medyo simpleng layunin at pagkakaroon ng medyo maliit na dami ng nilalaman. Ang portfolio ni Marie Laurent ay isang tipikal na halimbawa ng kung ano ang tatawagin ng maraming designer na isang minimalist na site.

Kasabay nito, ang paglalapat ng minimalism sa isang mas kumplikadong site ay maaaring maging mahirap. Ang mga nawawalang mahahalagang elemento ay maaaring makapinsala sa isang site na mayaman sa nilalaman (mababang density ng impormasyon ang pumipilit sa user na mag-scroll pa upang maghanap ng nilalaman). Ang pinakamahusay na solusyon magkakaroon ng landing page na gagawin sa istilong minimalism, na humahantong sa mas detalyadong mga pahina.

Konklusyon

Ang mga minimalistang site ay may simpleng interface, kung saan inalis ang mga hindi kinakailangang elemento at nilalaman na hindi sumusuporta sa pagpapatupad ng mga gawain ng user. Ang nagbibigay inspirasyon sa disenyong ito ay ang kumbinasyon ng kakayahang magamit at mataas na aesthetics: isang magandang site na may madaling nabigasyon ay isang makapangyarihang paraan ng komunikasyon.