Framer vs Figma vs WordPress: kõik mida vaja teada Framer'i kohta

Ma olen disainer. Lisaks olen suurema osa oma professionaalsest ajast olnud üksiküritaja. Tähendab see aga seda, et vajadused on olnud seinast seina – nii tagarakendus (back-end), eesrakendus (front-end) kui ka disain. Wordpress või Drupal, HTML, CSS ja hädapärane Javascript. Eriti kellegi kõrvalt õppida pole võimalust olnud – sest eriti kedagi pole kõrval olnud. Seetõttu on mul huvi disainist otse laivi, ehk nn no-code lahenduste vastu olnud pidevalt.

Ega väga häid lahendusi varasemast ajast meelde tulegi, kuigi üht-teist olen ikka katsetanud. Framer seevastu on üsna "lubav". Kirjutan siin all lahti oma nö testtulemused.

Pealkiri on sellepärast selline lollakas, et ma palusin ChatGPT-l see välja mõelda.

Mis on ja milleks on mõeldud Framer?

Niipalju kui mina aru saan, siis algselt oli Framer pigem prototüüpimistööriist. Kui ma ise mõned nädalad tagasi Frameri käsile võtsin ja püüdsin leida vastust küsimusele – mis on Framer ja mida Frameriga teha saab, siis sedalaadi vastuseid ma Googlest sain. Frameri kodulehe ja ka mõne Twitteri eesrakenduse arendaja, keda jälgin, andmeil, on tegu aga täielise veebiarendus tööriistaga. Iseküsimus vaid selles, milleks miski tööriist hea on – erinevaid töid tehakse erinevate riistadega.

Hetkeseisuga võin kinnitada järgmiseid asju:

Frameriga saab luua veebilehti:

• Luua maandumislehti

• Pidada blogi (kasutada CMS-ina)

• Muuta koduleht SEO-sõbralikuks

• Lisada päisesse ja jalusesse custom koodijuppe

• Treida juurde Reacti vidinaid

• ja …

… ja hetkel rohkem ei meenugi. Ent see sisuliselt ongi kõik, mis vaja.

Seega jah, Framer on täieline, no-code veebiarendustööriist

Kas Framer sobib veebiarenduseks?

Jah, väga hästi.

Küsimus on vaid selles, kust maalt jookseb piir, et mõni teine lahendus on parem kui Framer ja mis mõttes parem.

Kust king pigistama hakkab – millal on parem mõni muu tööriist veebiarenduseks valida kui Framer, ehk millal Framer hätta jääb?

Hind

Olgugi, et Framer on kasutatav ka tasuta – kui sul pole probleemi sellega, et all paremal nurgas on pisike banner: "Made with Framer" – siis üsna kiirelt tekib vajadus kasutada lisasid, mis aga on vaid tasulistes pakettides.

Näiteks tasuta paketi puhul on su veebiaadressiks umbes midagi sellist: visual-sense-654660.framer.app. Oma domeeni alla viimiseks on vaja esimest tasulist paketti, mis aastamaksu korral on 5€ kuus. See pole muidugi palju, ca sama on ka mõne kodulehe majutust pakkuva ettevõtte veebimajutuse hind.

Aga näiteks kui tahad lehtede ümbersuunamist, mis on üsna oluline juhul kui muudad mõne lehe aadressi, pead juba võtma paketi, mille maksumus on 28€ kuus. Kui aga tahad juba kasutada reverse proxy't ja modifitseerida canonical tag'i , on valikus plaan hinnaga 950€ kuus. See on juba päris jõhker. Siiski on iga mürgi jaoks olemas ka vastumürk, kirjutasin sellest siin: Kuidas Frameri "Canonical URL" korda teha, ent jah see eeldab natuke sedalaadi asjade nokkimisoskust.

Custom seadistused

Üldiselt saab Framer erinevate ülesannetega hästi hakkama. Ent siiski on valmislahendusele omaselt tal ka võimalusi vähem. Teisel juhul valikski kasutaja ju rätseplahenduse.

Nt SEO seadistustega on tal vaikimisi üsna hästi kõik (kui see eelnevalt märgitud kanoonilise urli teema kõrvale jätta), ent peenhäälestust teha ikkagi ei saa. Näiteks on mu lehel hetkel Google Speed Insights järgi sooritusvõime 75, mis ei ole otseselt paha, aga kui tahta skoor 100 saada, peaks ma saama seadistada pilte, optimeerima javascripti ja veel analoogset nipet-näpet.

Joonis 1. Siinse lehe skoorid. Pole paha, aga paremaks ka ei saa.

Mahukus ja keerukus

Viimane, vähjemalt esialgu, Frameri kitsaskoht näikse olevat loodava rakenduse mahukus. Kui on vaja erinevaid sisutüüpe, kui on vaja leheküljele kokku jooksva sisu keerukamat haldamist – nt hetkel ma ei teagi kuidas siinse lehe esikülg lahendada, kui postitusi juba mitmukümmend või mitusada tekib.

Loe siit mida Kaido kirjutab no-code ja low-code lahenduste kohta: "Millega peaksid arvestama, kui plaanid kasutusele võtta low-code või no-code tööriistu?"

Milles seisnevad Frameri tugevused, milles Framer hea on?

Frameri trump on visuaalne arendus, ehk saad koodi tundmata, käsitsi disainida valmis, töötava veebirakenduse. See muudab arenduse kiiremaks ja kättesaadavaks peaaegu kõigile. Eriti aga Figmaga tööd tegevatele disaineritele. Esmapilgul tunduski, et tegemist on mingi Figma edasiarenduse või klooniga.

Figma vs Framer

Joonis 1. Framer (vasakul) ja Figma kasutajaliidesed, suur osa seadetest on sarnased

Lihtsama lehe puhul võiks disainitöö ka Frameris ära teha, ent sodila haldamiseks on Figma ikkagi mõistlikum. Ja valmis disaini eksportimiseks Figmast Framerisse on olemas plugin ehk pistikprogramm, mis toob kujunduse koos elementide nimede ja seadistustega Figmast Framerisse.

Virnad ja raamid (stacks & frames) tulevad üle kenasti, aga üksjagu käsitööd peab failide Figmast Framerisse toomisel siiski veel tegema. Nt ei tule üle stiilid, samuti on parem erinevad breakpointid ehk mudepunkitd kujundada välja Frameris, et sisuosad erinevatel vaadetel lingitud jääks.

Video 1. Demonstratsioon disaini ületoomisest Figmast Framerisse – osa konteinerite seadetest – automaatne laius – ei tulnud üle. PIldi seadistamise, mis videos näha, oleks võinud teha ka Figmas.

Kas Wordpress või Framer?

Kui sul on kujundamissoov ja on vaja maandumislehte või mõne lehega kodulehte või kampaanialehte või ettevõtte turundusinimesed tahavad ise hirmsasti ilu luua vms, ei ole Wordpressil mingit pointi. Aja raiskamine. Kui sul on vaja väiksemat sorti blogi, nagu see siin, on samuti Framer märksa parem. Wordpressi (või Drupali või Joomla vms) mõte tekib alles suuremate lehtede puhul ja juhul kui sa ise ei ole disainer.

Kokkuvõte

Framer on ok tööriist veebilehtede loomiseks