Paskutiniame 2014 m. I / O renginyje „Google“ sugrįžo su naujomis staigmenomis. Be to, oficialiai išleido naują „Android“ atnaujinimą su kodiniu pavadinimu „Lollipop“, „Google“ taip pat pristatė savo naują naują dizaino kalbą „ Material Design“ . Tai dizaino sistema, skirta ne tik naujiems „Lollipop“ vartotojo sąsajos patobulinimams, bet ir visiems įrenginiams bei aplinkai.
„Material Design“ turi keletą pagrindinių funkcijų, kurios ją išskiria iš kitų dizaino tendencijų, turinčių savo unikalų būdą. Kaip ir jo pavadinimas, jis įkvėptas realių medžiagų ir sujungė jas į vieną dizaino sistemą, kad sukurtų elegantišką, intuityvų, gražią ir interaktyviausią vartotojo patirtį. Šiame pranešime mes peržiūrėsime, kas yra Medžiagų dizaino viduje, ir pateikiame jums trumpą vadovą, kaip jį įgyvendinti. Cituodamas „Google“ tinklaraštį, pasakysiu: „Tai yra materialus dizainas“.
Pristatymas
„Material Design“ yra vieninga projektavimo sistema, tai reiškia, kad ji buvo sukurta dirbti su visais esamais šiandienos įrenginiais ir platformomis. Nuo planšetinio kompiuterio, išmaniojo telefono į darbalaukį ir „Android“, „iO“, „Windows“ su interneto platformomis. Visi dizainai atrodo ir jaučiasi vienodai, kad ir kur jie būtų.
Pagrindiniai principai
Yra trys pagrindiniai principai, kuriais remiantis sukuriamas medžiagos dizainas. Tai yra svarbiausia Medžiagos pasiūlymų dalis.
- Medžiaga yra metafora . Medžiagos plėtojimą įkvėpė tiriamųjų elementų, kuriuos naudojame kasdien, popierius ir rašalas . Tai daro objekto šviesą, paviršių ir judesius geriau, kai bendraujama tarpusavyje.
- Drąsus, grafinis ir tyčinis . Tipografija, tinklai, erdvė, skalė, spalva ir vaizdų, naudojamų spausdinimo dizaino pagrindu, naudojimas gerina medžiagos turinį.
- „Motion“ suteikia prasmę . Tai vienas iš labiausiai pastebimų dalykų. Medžiaga turėtumėte turėti prasmingą ir tinkamą judėjimą, subtilų ir aiškų grįžtamąjį ryšį ir efektyvų bei nuoseklią perėjimą.
Komponentai
Medžiagos dizainas atkreipia dėmesį į kiekvieną detalę, kad jie galėtų būti naudojami visuotinai. Šie komponentai padės jums sukurti nuostabią programą ir svetainę. Yra tiek daug komponentų, kuriuos teikia medžiagos, pavyzdžiui, mygtukai, jungiklis, kortelė, teksto įvedimas, fab (plaukiojančio veiksmo mygtukas), dialogas, skrudinta duona, submeniu, skirtukas ir kt. Kiekvienas iš jų turi savo taisyklę ir vadovą, kaip juos kurti, taigi jums nereikės jokių svarbių elementų.
Raštai
Be komponentų, medžiaga taip pat suteikia jums keletą pagrindinių UI modelių. Šie modeliai pagerins naudotojo sąsają, kurią sukūrėte naudodami medžiagos komponentus. Modeliai, įskaitant duomenų formatą, navigacijos stalčius, klaidas, gestus, slinkimo techniką, paiešką, nustatymus, nuotraukų įkėlimą, braukimą ir atnaujinimą.
Medžiagos dizaino spalvos
Medžiagos spalvos buvo suprojektuotos taip, kad nesukels jums jaustis nepatogiai, keistai ir plokščiai. Įkvėpimas iš mūsų kasdieninės aplinkos, pavyzdžiui, kelio ženklų, šiuolaikinės architektūros, dangos ženklinimo juostos ir sporto aikštelių, Material Design atneša jums netikėtas ir nepaprastas spalvas. Yra tiek daug spalvų paletės, kad pasirinktumėte daugiau patogumo kuriant programas ar svetaines. Taip pat galite atsisiųsti spalvų spalvas vietiniam naudojimui, pavyzdžiui, „Photoshop“ kolekcijai.
Medžiagos piktograma
Jei esate „Android“ kūrėjas, turite būti susipažinę su kai kuriomis nemokamomis „Google“ pateiktomis piktogramų paketais. Jie paprastai naudojami tik pagrindiniam elementui ir veiksmų juostai. Kitiems ištekliams reikia ieškoti kitų piktogramų, pvz., Aplankų, failų, kopijų ir įklijų, ir tt rankiniu būdu. „Material Design“ „Google“ nustatė problemą su tonomis piktogramų pakuočių, kurias galite naudoti.
Kiekviena piktograma pasižymėjo tam tikru dizaino metodu, kuris taip pat naudoja lytėjimo medžiagų tyrimą. Jie taip pat palaiko materialųjį principą, kuris yra nuoseklus. Šias piktogramas galite atsisiųsti iš „GitHub“, jie turi tam tikrą pasirinkimą skirtingam naudojimui, pavyzdžiui, „iO“, „web“, „Android“ ar „svg“. Jei norite platesnės galimybės lengvai pritaikyti, jūs tikriausiai norėsite matyti „MaterialIm“ dizaino piktogramų paketus „FlatIcon“. Pakuotės viduje gausite piktogramos vektorių (SVG ir EPS), PSD ir PNG versiją.
Medžiagos animacija
Tai yra medžiagos, kuri labiausiai patinka, savybės. Medžiagos animacijos yra tokios realios ir intuityvios. Kiekviena animacija turi prasmingus, nuoseklius ir teisingus laiko tarpus. Žemiau rodomas „gif demo“ yra tik vienas iš gražiausių medžiagos animacijų. Norint suteikti patrauklią ir reaguojančią sąveiką, „Google“ komanda taip pat sukuria su vandeniu susijusį animaciją, skirtą vartotojo įvesties efektui. Jis dažniausiai naudojamas mygtukams ir kortelėms.
Šios savybės, kurias paaiškinau, yra tik nedidelė dalis medžiagos dizaino pasiūlymo. Norėdami daugiau sužinoti apie materialųjį pasaulį, tiesiog pereikite prie dokumentacijos puslapio.
Įgyvendinimas
Pagal numatytuosius nustatymus „Material Design“ yra naujas „Android Lollipop“ UI atnaujinimas. Visos gairės, kurias Medžiaga buvo pritaikytos viduje. Kadangi medžiaga skirta visoms aplinkoms, jos įgyvendinimas į kitą sistemą nebus sunkus. Bendruomenių dėka, kai kurios priemonės, kurias jie sukūrė, yra dar lengviau.
Tai yra keletas būdų, kuriuos galite pasiekti norint gauti „Material Design“ už „Android“, pavyzdžiui, internetą.
Naudojant CSS sistemas
Tai paprasčiausias būdas, jei norite įdiegti medžiagos dizainą žiniatinklio platformoje. Su sistemomis, viskas, ką jums reikia padaryti, yra inicijuoti, tada parašyti reikiamus elementus. Yra daug sistemų, kurias galite naudoti kaip „Materializuoti“, „Material UI“ arba „Polymer“. Mano asmeninis pasirinkimas patenka į materializaciją. Tai lengviau naudoti ir suprasti ir turi puikią dokumentaciją su gražia demonstracija.
Seka gaires
Jei norite įgyvendinti Medžiagą be pagrindų pagalbos ir norėtumėte labiausiai sujaukti su kodais, turite laikytis Medžiagų gairių. Čia rasite visus tuos, kuriuos reikia pastebėti, kad pasiektumėte materialinius principus. Pamatysite visus pagrindinius vadovus, kad sukurtumėte komponentus, išdėstymą, animaciją, spalvą, modelius ir kt. Galbūt norėsite pamatyti medžiagą, kad būtų lengviau sukurti.
Išvada
Medžiagų dizainas yra puiki dizaino sistema ir tapo viena iš labiausiai tikėtinų metų tendencijų. Per ateinančius kelis mėnesius galime matyti jį visur. Su šia nauja „Google“ dizaino naujinimu bus nubrėžta daugiau programų ir svetainės.
„Google“ įrodė savo pranašumą kaip vieną iš didžiausių technologijų kompanijų. Tai daro „Google“ ne tik pirmaujančią paieškos ir mobiliųjų OS srityje, bet ir dizaino srityje. Iki šiol nėra kitų kompanijų, kurios vystytų tokį didelį dalyką kaip „Google“. Tačiau patirtis sako, kad ji truks ilgai. Tik palaukite, kol kitos įmonės atsakys į „Google“ materialinį dizainą.
