Fitimet:
- Aftësia për të transformuar qëllimin e ekranit dhe përparësinë e përmbajtjes në një përmbledhje të qartë dhe për të prodhuar drafte dhe variacione të kornizës me inteligjencë artificiale
- Aftësia për të vlerësuar shpejt rezultatin e mjeteve që gjenerojnë ndërfaqe nga teksti dhe ekranin e tyre sipas parimeve të projektimit
- Aftësia për të maturuar kornizat e AI-së me një sy në përmbajtjen reale, rastet anësore dhe aksesueshmërinë
Wireframe është skeleti i një ekrani në nivel kutie, i zhveshur nga ngjyra, detaje vizuale dhe markë. Qëllimi i tij është i thjeshtë: të testojë shpejt prioritetin, vendosjen dhe rrjedhën e përmbajtjes; duke zgjidhur pyetjen “çfarë, ku, pse këtu” pa u futur në estetikë. Dizajni me besueshmëri të ulët përshkruan gjithashtu këtë fazë të parë, të përafërt të draftit. Inteligjenca artificiale e përshpejton rrënjësisht këtë hap: mjetet që gjenerojnë korniza teli nga teksti krijojnë një skicë të ekranit nga një kërkesë me një fjali. Por kjo shpejtësi nxit edhe keqkuptimin se "produkti i parë është dizajni përfundimtar". Kjo njësi mëson se si të gjenerohen në mënyrë inteligjente dhe të maturohen në mënyrë kritike kornizat me tel të AI.
Së pari shkurtimi, pastaj prodhimi
Shumica e kornizave të këqija lindin nga një përmbledhje e keqe. Nëse i thoni AI-së "bëni një ekran identifikimi", do të merrni një model të përgjithshëm. Një përmbledhje e fortë e kornizës së telit përfshin:
- Qëllimi i ekranit: Pse përdoruesi vjen në këtë ekran, çfarë përfiton prej tij?
- Përparësia e përmbajtjes: Cilat janë tre elementët më të rëndësishëm? Ku duhet të bjerë së pari syri i përdoruesit?
- Konteksti: Pajisja (celular/desktop), disponimi aktual i përdoruesit, ekrani i mëparshëm.
- Kufizimet: Elementet e kërkuara (mohimi i përgjegjësisë, elementi i markës), kufiri i hapësirës.
- Kërkesa për variacion: Sa paraqitje të ndryshme dëshironi të shihni.
Kur jepni këtë përmbledhje, modeli prodhon opsione të ndryshme që do t'ju ndihmojnë të merrni një vendim; Nëse përmbledhja është e dobët, të gjitha do të jenë të ngjashme dhe të padobishme.
Këshillë: Kërkoni nga AI jo një kornizë teli "të përsosur", por për 3 qasje dukshëm të ndryshme (p.sh. "një listë e rëndë, një imazh i rëndë, një e fokusuar në një veprim"). Shumëllojshmëri opsionesh ju hapin pikat e verbër.
Vendndodhja realiste e mjeteve që gjenerojnë ndërfaqe nga teksti
Vitet e fundit, mjetet që premtojnë "shkruaje dhe ndërfaqja shfaqet" janë përhapur gjerësisht. Këto prodhojnë një draft fillestar vërtet të shpejtë. Por nëse nuk i dini kufijtë e tij, do t'ju mashtrojë:
- Nuk është testuar me përmbajtje reale: Tekstet e mostrës janë gjithmonë gjatësia ideale; Nëse titulli aktual tejmbushet, faqosja mund të ndërpritet.
- Nuk ka raste të skajeve: Lista e zbrazët, emri i gjatë, rasti i gabimit zakonisht nuk vizatohen.
- Aksesueshmëria nuk është e paracaktuar: Kontrasti, zona e prekjes, renditja e leximit shpesh nuk kontrollohen.
- Është indiferent ndaj modelit mendor: modeli prodhon "ndërfaqen mesatare", jo zakonin e përdoruesit tuaj.
Qëndrimi i saktë: konsideroni rezultatin si draft fillestar, jo si dizajn përfundimtar. Ajo që e bën një kornizë teli "të mirë" është se ajo është testuar me përmbajtje reale, kornizë të skajshme dhe aksesueshmëri.
Skena
Prodhimi i AI
Pjekuria që ke shtuar
rendit të parë
Skeleti me vijë kutie
Rregullim bazuar në përparësinë e përmbajtjes
përmbajtja
Mostra e gjatësisë ideale
Testim me përmbajtje reale, të tejmbushur, boshe
kuti buzësh
Zakonisht asnjë
Gjendjet bosh/gabim/ngarkim
aksesueshmërisë
i pakontrolluar
Kontrasti, sekuenca, zona e prekjes
Lidhja e transmetimit
ekran i vetëm
Përputhshmëria me ekranin e mëparshëm/të ardhshëm
tre mini kuti
Rasti 1 - Tre variacione, vendim i qartë. Një projektues i kërkoi AI-së 3 paraqitje të ndryshme për një pult (përmbledhje-kartë, tabelë, grafik i rëndë). 3 drafte mbërritën në 15 minuta; Ekipi ua tregoi këto palëve të interesuara dhe mori një vendim drejtimi në 20 minuta. Nëse do të bëhej me dorë, 3 drafte do të duheshin gjysmë dite.
Rasti 2 - Përmbajtja aktuale prishi rendin. Në kornizën e AI-së, emrat e produkteve ishin gjithmonë 2 fjalë. Në katalogun aktual, disa emra ishin 40 karaktere dhe tejmbushnin kartat. Projektuesi ndryshoi paraqitjen pasi e testoi atë me të dhëna reale. Mësimi: mostra e përmbajtjes gënjeshtra; Provoni atë me përmbajtje reale.
Rasti 3 - Rasti bosh i harruar. Një kornizë teli e ekranit "të preferuarat e mia" po shfaqte vetëm listën e plotë. Përdoruesi i ri nuk ka të preferuar; Ekrani hapet bosh. Projektuesi i tha inteligjencës artificiale që "të vizatojë edhe gjendjen boshe" dhe shtoi një gjendje boshe udhëzuese. Mësimi: gjendja e zbrazët është pjesë e dizajnit kryesor, jo një skaj.
Përmbajtja përpara, kutia pas
Keqkuptimi më i zakonshëm në Wireframing është gabimi i dizajnit për "vendosje kutie". Megjithatë, një kornizë e mirë teli është e orientuar nga përmbajtja: së pari ju vendosni se çfarë informacioni duhet të jetë në ekran dhe me çfarë përparësie; Kutitë janë rezultat i këtij vendimi. Krijimi i një "përparësie të përmbajtjes" është hapi i parë i kornizës kabllore: ju renditni gjërat që përdoruesi duhet të shohë në këtë ekran nga më e rëndësishmja në më pak e rëndësishme. Inteligjenca artificiale është një partner i mirë në krijimin e kësaj liste; Ai i jep përparësi elementeve të mundshëm të përmbajtjes kur jepni qëllimin e ekranit. Pastaj ju e përktheni atë prioritet në rend: artikulli më i rëndësishëm në vendin më të dukshëm. Kur ky renditje kthehet mbrapsht – kur fillimisht vizatoni një plan urbanistik të këndshëm dhe më pas përpiqeni të përshtatni përmbajtjen – informacioni që i nevojitet në të vërtetë përdoruesi hidhet në sfond.
Kujdes: Një kornizë teli me pamje të bukur mund të fshehë përparësinë e gabuar të përmbajtjes. "A është i bukur ky konfigurim?" por "A është informacioni më i rëndësishëm gjëja e parë që ju bie në sy?" pyesni.
Kërkesat e kopjueshme
Roli juaj: dizajner i lartë i produktit.Qëllimi i ekranit: <<qëllimi>>. Pajisja: <<celular/desktop>>. 3 artikujt kryesorë: <<lista>>. Elementet e kërkuara: <<lista>>. Detyra: Sugjeroni 3 qasje dukshëm të ndryshme të kornizës teli (me tekst, seksion pas seksioni). Për secilën qasje: logjika e paraqitjes, renditja e përparësisë dhe pse do të funksionojë.
Testoni këtë përkufizim të kornizës së telit në kushte të botës reale:<<teksti i kornizës së telit>>. Vizatoni ose përshkruani: gjendjen e zbrazët, përmbajtjen e gjatë (tejmbushjes), gjendjen e gabimit, gjendjen e ngarkimit. Për secilën, shkruani se si duhet të përshtatet faqosja.
Kontrolloni këtë kornizë teli për akses: a ka kuptim rendi i leximit, a janë të mjaftueshëm objektivat me prekje, a ka vetëm informacione të bazuara në ngjyra, a është i dukshëm veprimi parësor? Rendisni problemet dhe sugjerimet një nga një. Korniza e telit: <<tekst>>
Gjeneroni përmbajtje realiste të mbajtësit të vendndodhjes për këtë kornizë teli: 5 tituj me gjatësi të ndryshme (nga e shkurtër në shumë e gjatë), 3 tekste statusi boshe, 2 mesazhe gabimi. Qëllimi: të testohet dizajni me përmbajtje reale, jo ideale. Konteksti: <<ekrani>>
Prompt i dobët / Prompt i fortë
E dobët: "Bëni një kornizë teli të faqes kryesore."
Rezultati: Një skelet i përgjithshëm me prioritet të paqartë të përmbajtjes, uniformitet dhe pa kaza.
E fortë: "Sugjeroni 3 qasje të ndryshme të kornizave teli për faqen kryesore të celularit me qëllimin X; 3 elementët më të rëndësishëm janë; shpjegoni logjikën e përparësisë së secilës qasje; gjithashtu tregoni statusin bosh dhe të gabimit."
Rezultati: Opsione të krahasueshme, të prioritizuara, realiste.
Dallimi: kërkesa e fortë jep qëllim + përparësi + variacion + rast të skajit.
Gabimet e zakonshme
- Duke e konsideruar rezultatin e parë si dizajn përfundimtar. Wireframe AI është fillimi; Procedimi në gjendjen e tij të papjekur është i kushtueshëm.
- Jini të kënaqur me përmbajtjen e mostrës. Teksti i rremë me gjatësi ideale e bën paraqitjen të duket gabimisht e bukur.
- Anashkalimi i gjendjeve null dhe gabimi. Ekrani i parë që shikon përdoruesi është shpesh bosh.
- Duke e lënë aksesueshmërinë për të fundit. Kontrasti dhe rendi i leximit merren parasysh në fazën e kornizës së telit dhe nuk korrigjohen më vonë.
- Duke vazhduar me një variacion të vetëm. Fiksimi i idesë së parë pa gjeneruar opsione i zmadhon pikat e verbëra.
Në përmbledhje
Wireframing është mënyra më e lirë për të testuar përparësinë dhe rrjedhën e përmbajtjes pa kaluar në estetikë; AI e përshpejton shumë këtë fazë. Çelësi është të jepni një përmbledhje të fortë (qëllimi, përparësia, konteksti, kufizimi, variacioni) përpara prodhimit dhe ta shikoni produktin si një draft fillestar. Prodhimi i mjeteve që gjenerojnë ndërfaqe nga teksti nuk maturohet derisa të testohet me përmbajtje reale, rastet e skajeve dhe aksesueshmërinë. Përdorni modelin si një gjenerator të shpejtë opsionesh; Ju shtoni pjekurinë dhe vendimin.
Detyra e aplikimit
- Zgjidhni një ekran dhe shkruani një përmbledhje që përfshin qëllimin, 3 elementët më të rëndësishëm dhe elementët e detyrueshëm.
- Gjeneroni 3 qasje qartësisht të ndryshme me kornizë teli me kërkesën e parë.
- Me kërkesën e katërt, prodhoni përmbajtje realiste (shkurtër-gjatë-bosh) mbajtëse vendesh dhe provoni paraqitjen.
- Shtoni statuse boshe, gabimi dhe ngarkimi me kërkesën e dytë.
- Kryeni një kontroll të aksesueshmërisë me kërkesën e tretë dhe postoni gjetjet në kornizë.
listë kontrolli
- [ ] Kam shkruar një përmbledhje me qëllimin dhe prioritetet përpara prodhimit.
- [ ] Unë prodhova jo një, por 3 variacione të ndryshme.
- [ ] Kam testuar paraqitjen me përmbajtje realiste (të gjatë/të shkurtër/bosh).
- [ ] Kam projektuar gjendje boshe, gabimi dhe ngarkimi.
- [ ] Unë bëra kontrollin e aksesueshmërisë në fazën e kornizës.
- [ ] Unë e trajtova rezultatin si një draft fillestar dhe e maturova atë.