Saidi traatraamistik (või saidi struktuur) on organisatsiooni diagramm, mis määrab veebisaidi lehtede struktuuri ja hierarhia. Raam on veebisaidi arendamise aluseks, aidates sisu korrastada ja pakkuda kasutajatele loogilist navigeerimist. Veebilehe loomine on palju lihtsam kui varem. See on aga endiselt oluline projekt. Ja nagu iga teine ​​projekt, vajate kindlat plaani.

Teie veebisaidi paigutus on selle plaani kõige olulisem osa. Värve, graafikat ja muud sisu saab muuta palju lihtsamalt kui paigutust. Mõelge paigutusele kui oma veebisaidi skeletile. See määrab iga lehe struktuuri, mida hiljem täpsustatakse.

Traatraam on veebisaidi paigutuse ligikaudne ülevaade. See näitab, kus kõik erinevad elemendid asuvad. See teeb seda ideaalne veebilehe loomise lähtepunkt. Pädevad veebidisaini agentuurid alustavad alati traatraamist. Kui arendate oma veebisaiti, kas üksi või meeskonnas, leiate ka väärtusliku raamistiku.

Veebisaidi traatraami saab alati joonistada pliiatsi ja paberiga. See pole aga vajalik, kui saadaval on palju raamimise tööriistu.

Vaatame mõningaid populaarsemaid veebisaitide raamimise tööriistu.

 

Miks kasutada traatraami tööriista?

Isegi sellises kaasaegses valdkonnas nagu veebidisain eelistavad mõned disainerid siiski kasutada vanu meetodeid. Kodulehe paberile joonistamises pole muidugi midagi halba. See on tõestatud meetod, mis on varem tuhandete veebidisainerite jaoks suurepäraselt töötanud. Kuid raamimistööriista kasutamine võib säästa palju aega ja vaeva. Veebisaidi raamistik

  • Raamimise tööriista kasutamine annab teile parema lähtepunkti. 

Pliiatsi ja paberiga alustate sõna otseses mõttes tühjalt lehelt. Raamitööriistad muudavad alustamise lihtsaks. Enamikul on paigutusjuhised, isegi kui see on lihtne ruudustik. Mõned pakuvad isegi vaikeelemente, mille saate lehele paigutada, nii et te ei pea midagi joonistama.

  • Redigeerimine ja parandused on muutunud palju lihtsamaks. 

Kui töötate paberil, peate iga suure muudatuse tegemisel kogu traatraami ümber joonistama. Paljud traatraamimise tööriistad võimaldavad elemente lihtsalt pukseerida. See võib säästa tunde, olenemata sellest, kas viimistlete originaali kujundada või teha muudatusi vastavalt kliendi soovile.

  • Tulemused näevad professionaalsemad. 

Ka parimal disaineril võib joonistamisoskustest veidi puudu jääda. Traatraamimise tööriistaga ei pea te kunagi muretsema sirgjoone tõmbamise või elemendi täiusliku keskele asetamise pärast. Kuna traatraam on lihtsalt traatraam, ei ole selle välimus loomulikult nii oluline kui valmis veebisaidi välimus. Aga kui sa töötada klientidega, võib ülipuhas raam neile muljet avaldada. See võib ära hoida ka arusaamatusi, näiteks kui klient eeldab, et elementi ei tsentreerita lihtsalt seetõttu, et see joonistati traatraamis keskelt veidi kõrvale.

  • See on teie meeskonna jaoks mugavam. 

Raamtööriistad muudavad teistega koostöö tegemise palju lihtsamaks. Paljud tööriistad võimaldavad teil anda juurdepääsu mitmele kasutajale, et kõik saaksid töötada samade failidega. Koostööfunktsioonide abil saab teie meeskond kaotada vajaduse jagada faili praegust versiooni. Kogu teie meeskond saab sujuvalt koos töötada, olenemata sellest, kas olete samas kontoris või mitte. Veebisaidi raamistik

  • See on veebidisaini klientidele mugavam. 

Kuna raamimistööriista kasutamine on teie meeskonna jaoks kiirem ja lihtsam, parandab see ka teie pakutava teenuse kvaliteeti, kui arendate veebisaite teistele. Teie kliendid saavad traatraami näidiseid kiiremini ja teil on palju lihtsam muudatusi teha. See parandab klienditeeninduse kvaliteet. Ja loomulikult jätavad rahulolevad kliendid teile suurema tõenäosusega hea ülevaate või soovitavad teid teistele kliente teie ettevõttele.

Seega, isegi kui olete puhaste traatraamide kiire paberile joonistamise ekspert, tasub võtta aega, et õppida traatraami tööriista kasutama. Õnneks on paljud neist tasuta ja paljudel tasulistel tööriistadel on tasuta prooviversioonid, mis aitavad teil valida endale ja teie meeskonnale sobivaima. Vaatame, mis seal on!

 

Wireframe.cc Saidi raam

Wireframe.cc Veebisaidi raam

Liik: veebirakendus

maksumus: Saadaval tasuta versioon; lisatasu 16–99 dollarit kuus

Traadiraam.cc on minimalistlik traatraami tööriist neile, kes eelistavad pliiatsit ja paberit. See töötab otse teie veebibrauseris, nii et allalaadimine pole vajalik. Rakendus algab lihtsa ruudustikuga, millele saab erinevate tööriistade abil joonistada erinevaid traatraami elemente. Seda on väga lihtne kasutada ja sellel on tasuta versioon. Kui otsustate, et tasuta versiooni funktsioonid on liiga piiratud, võite minna üle esmaklassilisele paketile, et avada rohkem funktsioone.

 

Jumpchart Site Wireframe

Kiirtabel

Liik: veebirakendus

maksumus: Saadaval tasuta versioon; lisatasu 5–50 dollarit kuus.

Kiirtabel pole mõeldud visuaalseks veebisaidi kujundamiseks. Selle asemel on see loodud selleks, et aidata teil planeerida, kuidas teie üksikud lehed on üksteisega seotud. See on UX-i (kasutajakogemuse) jaoks sama oluline kui lehepaigutused, mistõttu on kiirdiagramm veel üks väärtuslik tasuta tööriist, mille saab lisada oma veebisaidi planeerimise arsenali. Nagu arvata võis, on tasuta plaanil oma piirangud (üks projekt kuni 10 lehekülge ja 2 kasutajat), kuid see on suurepärane lähtepunkt lihtsa veebisaidi kavandamisel. Tasulised plaanid annavad teile rohkem võimalusi ja võimaldavad töötada rohkemate lehtede ja meeskonnaliikmetega ning mitme projektiga korraga.

Kui olete ambitsioonikas väikese eelarvega veebidisainer, annab Wireframe.cc ja Jumpchart koos kasutamine teile kõik veebisaidi planeerimiseks vajaliku. See on visuaalne paigutus, mida hõlmab esimene, ja saidiplaani planeerimine, mida hõlmab teine. Mõlemad rakendused täiendavad üksteist väga hästi ja on tasuta saadaval ilma allalaadimiseta.

 

Gliffy/Site traatraam

Gliffy/ Veebisaidi traatraam

Liik: veebirakendus

maksumus: Saadaval tasuta versioon; täisversioon 7,99 dollarit kuus

Glyffy mitte ainult traatraamide jaoks. See on veebipõhine diagrammirakendus, kuid see sisaldab traatraamid ja muud tüüpi paigutusi. See on veidi vähem intuitiivne kui Wireframe.cc või Jumpchart, kuid seda on siiski lihtne kasutada (pukseerimine) ja see võib teenida mõlema ülaltoodud rakenduse eesmärke. Gliffy abil saate luua veebilehtede jaoks traatraamid ja vooskeemid, mis esindavad teie saidiplaani. Sellel on mitmeid sisseehitatud elemente, mis esindavad veebilehe või muu paigutuse erinevaid osi, ja saate ka oma pilte üles laadida. See võib olla kasulik ka muude projekteerimis- või planeerimisülesannete jaoks, mis hõlmavad diagrammide koostamist. Veebisaidi raamistik

 

MockFlow

MockFlow

Liik: veebirakendus

maksumus: Saadaval tasuta versioon; lisatasu 19–45 dollarit kuus.

MockFlow ühendab ka funktsioone traatraamide loomiseks ja saidikaartide kavandamiseks. See on rohkem spetsialiseerunud kui Gliffy, seega keskendub see rohkem veebisaitidele ja meeskonna koostööle kui diagrammidele. Selle traatraamimise tööriistad on suurepärased, koos valmis paigutuste ja komponentide teegiga, mis aitab teil alustada. Saate lihtsalt mõne minutiga luua traatraami ja seejärel redigeerida seda vastavalt oma soovile. Premium-paketid avavad lisafunktsioonid, nagu väärtuslikud meeskonna koostööfunktsioonid ja palju muud. Kui maksate kord aastas, saate 20% allahindlust ning lisaks mõned lisafunktsioonid, nagu võrguühenduseta režiim ja lisatööriistad. Veebisaidi raamistik

 

Canva

Canva

Liik: veebirakendus

maksumus: Saadaval tasuta versioon; täisversioon 9,99 dollarit kuus (arvestatakse igal aastal)

Canva on populaarne veebitööriist professionaalse kvaliteediga graafika loomiseks, isegi kui te pole disainer. See on täis malle, illustratsioone, fotosid ja palju muud. Kuna see ei ole spetsiaalne traatraamimise tööriist, puuduvad sellel mõned funktsioonid teistest lahendustest, mida oleme seni vaadanud. Siiski saate seda kasutada kaadrite loomiseks väga lihtsalt, kasutades pukseerimist.

 

Adobe XD/Site Framework

Adobe XD / veebisait Wireframe

Liik: Tarkvara; saadaval Maci ja Windowsi jaoks

maksumus: Saadaval tasuta versioon; täisversioon algab 9,99 dollarist kuus.

Adobe XD on täiustatud UX-i disainitööriist, mille on loonud Photoshopi, Illustratori, InDesigni ja muu kuulsa professionaalse tarkvara arendajad. Kui olete Adobe tarkvaraga tuttav, olete teadlik nende kõigi rakenduste kõrgest spetsialiseerumisastmest ja võimsusest. Niikaua kui olete valmis õppimiskõveral üles ronima, annavad nende tööriistad teile suure kontrolli, mis võimaldab teil toota peaaegu kõike, mida arvate. Adobe XD ei erine sellest, pakkudes rikkalikku ja tugevat veebidisaini tööriistade komplekti. See läheb kaugemale veebisaidi traatraamidest ja võimaldab teil luua ka terviklikke makette ja isegi prototüüpe ühes projektifailis. Õnneks on seda ka lihtsam kasutada kui muud Adobe tarkvara, seega tasub seda kindlasti proovida, kui otsite täpsemat lahendust. Veebisaidi raamistik

 

Joonis fig

Joonis fig

Liik: Saadaval veebirakendusena ja tarkvarana Maci, Windowsi ja Linuxi jaoks.

maksumus: Saadaval tasuta versioon; lisatasu 12–45 dollarit kuus.

Joonis fig keskendunud tugevalt meeskonnaliikmete vahelisele reaalajas koostööle. Siiski tema tööriistad on sama kasulikud isegi soolodisaineritele. Figma pakub kõike, mida vajate traatraami loomiseks, olenemata sellest, kas otsite põhikujundust või soovite minna edasijõudnumale. Redigeerimistööriistad pakuvad suurt täpsust, nii et saate kujundust vastavalt vajadusele kohandada. Figma ühildub suurepäraselt ka mitme operatsioonisüsteemiga, seega võib see olla ideaalne lahendus Linuxi arendusmeeskonnale.

 

Kuidas valida raamimistööriista

Teie tööriistade valik peaks alati sõltuma teie vajadustest. Veebisaidi raamistik ei erine selles osas ühestki teisest projektist. Samuti on oluline eelnevalt valida õiged tööriistad. Loomulikult võite alustada väiksema eelarvega ja seejärel võimalusel uuendada. Kuid soovite vältida selliste tööriistade kasutamist, mis teie vajadustele üldse ei sobi. Veebisaidi raamistik

Niisiis, kuidas valida veebidisaini jaoks parim raamimistööriist? Küsige endalt järgmised küsimused:

  • Mis on minu eelarve? Arvutage, kui palju saate endale lubada kulutusi tarkvarale või esmaklassilistele rakendustele juurdepääsule. Pidage meeles, et see on tavaliselt kuu- või aastamaks.
  • Kui paljud meeskonnaliikmed vajavad juurdepääsu tööriistadele? See võib tähendada erinevust tasulisele versioonile ülemineku või tasuta konto kasutamise vahel.
  • Millises operatsioonisüsteemis peaks tööriist töötama? Kui te pole kindel, on kõige turvalisem jääda veebirakenduste juurde.
  • Milliseid funktsioone ma vajan? Võrrelge saadaolevaid funktsioone oma projekti suurusega. Kui teil on vaja luua ainult lihtne traatkarkass, sobib piiratum tööriist. Kuid kui teil on vaja täielikult uurida traatkaare ja prototüüpe või planeerida ka saidiplaani struktuur, on teil parem kasutada täiustatud tööriista (või mõlema kombinatsiooni).
  • Milline on minu mugavuse tase konkreetse tööriistaga? Kui olete oma valikud oma vajaduste põhjal kitsendatud, proovige mis tahes tööriistu, mis neile nõuetele vastavad. Kasutage kõiki tasuta prooviversioone! Isegi sarnaste võimalustega tööriistadel võib olla väga erinev kasutuskogemus. Valige see, millega teil on lihtne (või isegi lõbus) töötada.

 

Põhipunktid / saidi raamistik

Veebikujundus on rahuldust pakkuv valdkond, kus on palju tööriistu, mis muudavad selle lihtsamaks. Raamimise tööriist võib teie töövoogu lihtsustada ja saada teie projekteerimisprotsessi keskseks osaks. Teeme kokkuvõtte, mida oleme käsitlenud:

  • Raamitööriist muudab veebidisaini palju lihtsamaks ja kiiremaks disaineri jaoks, töötades üksi või koos agentuuriga.
  • Saadaval on palju suurepäraseid valikuid, olenemata sellest, kas soovite kasutada veebirakendust või installida arvutisse tarkvara.
  • Erinevad raamistiku tööriistad võivad olla paremad suuremate meeskondade ja/või suuremate projektide jaoks. Teised on piiratumad.
  • Paljud raamimistööriistad pakuvad tasuta versiooni ja maksmine võib paljud neist piirangutest eemaldada.
  • Õige traatraamimise tööriista leidmiseks peate endalt esitama mõned põhiküsimused.
  • Otsige alati tasuta prooviversiooni, mida saate tarkvaraga tutvumiseks kasutada.

Olenemata sellest, kas olete kogenud disainer või alles alustate, leiate midagi teie jaoks ideaalne paigutustööriist. Kui olete selle leidnud, ei lähe te enam kunagi pliiatsi ja paberi juurde tagasi!

 АЗБУКА