Bhí an tsonraíocht Ábhar Dearadh ó Google dírithe ar ardán Android ar dtús mar bhealach chun comhsheasmhacht a mholadh ar an ardán.
01 de 06
Conas Cárta Ábhar Deartha a chruthú i Adobe Experience Design CC
Nuair a thosaigh dearthóirí ag dul tríd agus ag smaoineamh ar an smaoineamh taobh thiar de, tá Ábhar Dearadh ar cheann de na fealsúnachtaí radhairc is tábhachtaí i ndearadh gréasáin agus soghluaiste . Gach ní mór duit a dhéanamh chun an méid atá á fháil againn a fheiceáil ná cuardach Ábhar Dearadh a dhéanamh ar Pinterest agus feicfidh tú na céadta samplaí agus turgnaimh ar fheistí, táibléad, agus fiú láithreáin ghréasáin.
Is í an ghné iontúil a bhaineann le Ábhar Dearadh ná smaoineamh Google maidir le conas a d'fhéadfadh na apps a bheith le feiceáil agus a bheith ag obair ar ghléasanna soghluaiste ach tá na coincheapa á gcur i bhfeidhm ar aon scáileán ar aon mhéid ar aon ardán. De réir mar a deir Google i mír oscailte an tsonraíocht, "Dúshlán dúinn féin chun teanga amhairc a chruthú dár n-úsáideoirí a shíníonn prionsabail clasaiceacha dea-dheartha le nuálaíocht agus féidearthacht teicneolaíochta agus eolaíochta. Is dearadh ábhartha é seo. Is doiciméad beo é seo an tsonraíocht a nuashonrófar mar a leanfaimid orainn ag forbairt na ngnéithe agus na dearadh ábhartha. "
Is é an t-ábhar a labhair, i dtéarmaí an-ghinearálta, páipéar agus is é an chárta a bhaineann le Ábhar Dearadh. Smaoinigh ar chárta innéacs ar dhromchla agus tá tú ar an mbóthar ceart. Is gné é cárta ina bhfuil grianghraif, físeáin, naisc téacs agus mar sin de, ach nuair a bhíonn siad difriúil ón gcuid is mó dearaí idirghníomhacha tá siad i gceist díriú ar ábhar amháin. Tá coirnéil chothromaithe ag na cártaí, ina bhfuil scáthanna fána ina bhfuil siad os cionn dromchla agus má tá siad ar fad ar an bplána céanna dá ngairtear "bailiúchán" orthu.
Sa "How To" seo táimid ag iarraidh cárta a chruthú bunaithe ar an sonraíocht. Seachas an cárta a chruthú le héagsúlacht íomhánna agus uirlisí líníochta, táimid ag teacht uaidh ó threoir difriúil. Táimid ag úsáid na n-uirlisí i Adobe's Experience Design atá i réamhamharc poiblí amháin Macintosh faoi láthair agus tá sé saor in aisce. Is féidir leat é a íoslódáil anseo.
Ar aghaidh linn.
02 de 06
Ag Cruthaiú an Fréamhshamhail Artboard i Adobe Experience Design CC
Níl aon bhealach ann le scáileán Android a chruthú ón Scáileán Tosaigh i dTeicneolaíocht Dearadh CC (XD). Is é an rud a d' úsáidfimid nuair a osclaíonn muid XD, roghnaigh an rogha iPhone 6 agus nuair a osclaíonn an comhéadan, roghnaímid an uirlis Artboard ag bun an Barra Uirlisí agus roghnaigh Android Mobile ó na roghanna ar an bpainéal Airíonna ar dheis. Ansin táimid ag aistriú chuig an uirlis roghnóireachta, cliceáil uair amháin ar ainm iPhone artboard agus scrios an artboard. Nach bhfuil níos mó.
Sa leagan reatha de XD, tá saighead beag in aice leis an iPhone 6 agus, nuair a cliceáiltear, roghnaíonn sé roghchlár anuas. Ón áit sin roghnaíonn tú an leagan Android Mobile agus osclaíonn an clár portráid Android Mobile sa chomhéadan.
Chun a chinntiú go mbeidh an spás ceart scáileáin oscailte don chárta, is gnách go dtéann muid ar aghaidh chuig Sceitse 3 agus cóireáil agus greamaigh Stádas Barra, Barra Nav, agus barra Iarratais ón Teimpléad Ábhar Dearadh isteach sa chlár. Tá teimpléad Ábhar Dearadh i Sceitse 3.2 ( File> New From Template> Ábhar Dearadh ) agus tá ceann eile i ndáiríre saor ó Kyle Ledbetter ar féidir leat a fháil anseo. Mura bhfuil Sceitse agat, is féidir leat iad a chóipeáil agus a ghreamú ó na greamáin XD a fhaightear i File> Open UI Kit> Google Material . Is féidir leat iad a íoslódáil ó Google freisin le húsáid i Photoshop, Illustrator, After Effects and Sketch.
03 de 06
Cárta Deartha Ábhar a chur le Adobe XD CC Artboard
Ceann de na gnéithe is úsáideacha de XD ná go gcuimsítear KITanna UI do Apple iOS, Google Material, agus Microsoft Windows. I go leor bealaí, cuireann siad an focal "Mear" leis an téarma "Prototyping Mear". Chomh maith leis sin, ní dhéanann siad níos éasca le hobair an dearthóra sna heilimintí Chomhéadain Uile sin a athchruthú i gcónaí i bhFeidhm Deartha, mar shampla Photoshop, Illustrator nó Sceitse.
Ba é cárta an ghné Chomhéadain a theastaigh uainn. Chun é a fháil, roghnaigh muid File> Open UI Kit> Google Material agus d'oscail an trealamh mar dhoiciméad nua. Fuarthas an ghné a theastaigh uainn sa chatagóir Cártaí.
Céard is breá linn faoi seo, cloíonn siad leis an sonraíocht Ábhar Dearadh mar a leagtar amach sna sonraíochtaí Bloic Ábhar chomh maith leis na sonraíochtaí téacsála agus spásála atá leagtha amach sa sainchomhad Typography.
Ba é an stíl cárta a theastaigh uainn ná an ceann ar an taobh clé. Marcaeamar é ach lenár luch agus é a chóipeáil go dtí an gearrthaisce. Ar an drochuair, níl comhéadan tabbed ag XD do dhoiciméid oscailte. Is é an rud a dhéanaimid ná an fhuinneog dhoiciméad oscailte a aistriú le beagán chun an duine atá ag obair a nochtadh, a roghnú agus a ghreamú. Is bealach eile é a athrú go tapa idir doiciméid oscailte XD ná brúigh Ordú- ' .
04 de 06
Conas Eagrán Deartha Ábhar a Athrú i Adobe Experience Design CC
Nuair a thagann an cárta in XD as an gearrthaisce ní thosaíonn sé ag obair leis. Is é an chéad rud is gá duit a dhéanamh leis an gcárta a Ungroup toisc go dteastaíonn rochtain ar an bpíosa agus ar na píosaí atá ag comhdhéanamh an chárta. Chun seo a dhéanamh, roghnaigh an cárta agus roghnaigh Réada> Comhfhreagras nó brúigh Shift-Command-G.
Tá trí phíosa i do chárta anois:
- Bosca liath liath don íomhá.
- Bosca meánach liath don téacs
- Úsáidtear an cúlbhosca mar chúlra.
Is é an chéad chéim ná an bosca solas liath a scriosadh. Is é an t-aon chuspóir é ná gníomhú mar shealbhóir áit don íomhá a dhéanann sé, má roghnaíonn tú, roghnach.
Is é an bosca leis an téacs liath dorcha i ndáiríre agus éadrom 50%. Is féidir an bosca seo a úsáid mar chúlra an téacs agus is féidir leat athrú ar an dath agus ar dhlúsacht an bhosca.
Cé nach bhfuil sé le feiceáil láithreach, leanann an bosca solas liath an sonraíocht Ábhar Dearadh sa mhéid is go bhfuil 2 picteilín á gcruthú ag na coirnéil is airde. Coinnigh seo i gcuimhne má tá tú ag cur íomhá. Beidh sé riachtanach freisin na coirnéil chothromú a fhéadfar a chur le hiarratas íomháithe nó i XD.
Ag féachaint ar an gcaoi a bhfuil sé seo mar chuid eile den chárta tá scáth ag teastáil uait. Tugann an sonrú soiléir go bhfuil ingearchló ag fágáil an chárta 2 picteilín. Chun seo a chur leis, roghnaigh an cruth cúlra dubh agus luachanna Y agus B (Blur) a shocrú go 2 sa phainéal airíonna.
05 de 06
Conas Íomhá a chur leis an gCárta Ábhar Deartha in Adobe XD CC
Tá 344 picteilín ar fud an chárta agus tá 150 pixel ar airde ag an íomhá ( leath airde an bhosca solais liath ) D'oscail muid an íomhá i Photoshop, chuir sé an méid sin agus é a shábháil ag baint úsáide as an rogha @ 2x i dtrácht Easpórtáil Photoshop's As bosca. Rinneadh an íomhá a allmhairiú isteach i Adobe XD.
Tarraing muid an bosca liath éadrom thar an íomhá ar an gclár agus roghnaigh Réada> Masc Le Cruth . Ba é an toradh an íomhá a bhain le coirnéil chothromaithe an chruth. Ansin bhog muid an íomhá go dtí a seasamh deiridh.
Leis an íomhá atá ann, d'athraigh muid dath cúlra an bhosca Meán-liath, d'athraigh sé an téacs agus dath an téacs nasc.
06 de 06
Ag baint úsáide as an Gné Grid Adobe XD CC
Leis an gcárta a chomhlánú ní mór é a chur i gceart anois de réir na sonraíochta Ábhar Dearadh. Ciallaíonn sé seo go bhfuil 8 picteilín ar gach taobh den chárta agus caithfidh 8 cártaí a bheith sa chárta faoi bhun an bharra. Chun seo a dhéanamh, cliceáil uair amháin ar ainm an chláir agus, sa Phainéal Airíonna, roghnaigh Grid. Is cosúil go bhfuil an eangach thar an gclár.
Is é an méid greille réamhshocraithe 8 picteilín a tharlaíonn an méid greille céanna le haghaidh Dearadh Ábhar. Má tá méid difriúil uait, an luach a athrú sa cheantar Grid. Más mian leat dath an ghreille a athrú, cliceáil ar an sliseanna dath agus roghnaigh dath ón Piocálaí Dath mar thoradh air.
Leis an eangach atá le feiceáil, cliceáil ar an gcárta agus é a aistriú ina seasamh deiridh.
Le críochnú suas, roghnaigh muid an cárta, cliceáil ar an gcnaipe Greille Athrá agus d'athraigh an spásáil idir na cártaí go 8 pixel freisin.