Au trecut 10 luni de când am lansat Page Builder Sandwich pentru public. Avem acum în jur de 6.000 de instalări active, iar aceasta este o adevărată realizare pentru noi. Am primit o mulțime de feedback datorită acestui fapt, atât bun, cât și rău. Consensul este totuși că oamenilor le place cât de ușor este să construiască machete și să-și creeze conținutul în comparație cu celelalte instrumente de construire a paginilor de pe piață.
O mare parte din feedbackul primit a constat în solicitări de funcționalități și am adăugat multe dintre aceste funcții în ultimele luni. Dar, pe măsură ce am continuat să facem acest lucru, am început, de asemenea, să modificăm treptat interfața cu utilizatorul în acest proces. Și, în consecință, modificam și experiența utilizatorului… în rău. S-a ajuns însă în punctul în care a trebuit să regândim interfața, deoarece pur și simplu nu mai funcționa fluent, iar diferitele funcționalități nu se mai potriveau bine cu ea.
Interfața scoasă din uz
În versiunile anterioare ale PBS, ne-am dorit ca totul să fie sub formă de butoane. De ce? Pentru că butoanele sunt ușor de utilizat. Pur și simplu… apeși pe ele. În versiunile mai vechi ale inspectorului (bara laterală din imaginea de mai sus), un clic pe un buton creștea o valoare, iar shift+clic pe un buton o micșora. Sună destul de simplu. Dar, odată cu adăugarea de caruseluri, taburi, hărți și alte elemente și funcționalități noi, toate acele butoane au devenit o aglomerație de pictograme diferite, cu designuri diferite, și au început să semene mai degrabă cu niște hieroglife decât cu o interfață atractivă. Acest lucru nu a fost o problemă pentru utilizatorii experimentați, dar este destul de intimidant de privit dacă ești nou în PBS.
În continuare, au apărut câteva probleme în inspector. Ideea inițială a fost de a face totul simplu și disponibil în interiorul inspectorului. Și prin totul, mă refeream la tot – de la transformarea textului în titluri, până la schimbarea culorilor de fundal, a culorilor fonturilor și așa mai departe. Cu toate acestea, în starea actuală, inspectorul conține acum o mulțime de opțiuni care te obligă să folosești rotița mouse-ului pentru a derula constant în sus și în jos. Destul de diferit de inspectorul pe care speram inițial să-l creez pentru utilizatori.
În cele din urmă, am introdus recent maparea shortcode-urilor pentru pluginurile tale preferate. Această funcționalitate a necesitat crearea de câmpuri de text, glisoare numerice, casete de selectare și noi tipuri suplimentare de opțiuni necesare pentru a vă face experiența de editare a shortcode-urilor mai plăcută. Inițial, a fost o idee bună și, da, a făcut manipularea shortcode-urilor mai ușoară pentru tine. Dar, din nou, această funcționalitate s-a abătut de la interfața noastră „doar butoane”. Privind retrospectiv, a fost într-adevăr imposibil să folosim doar butoane pentru modificarea atributelor shortcode-urilor. Acum, în cea mai recentă versiune, am ajuns să avem 2 tipuri de controale: butoanele și câmpurile pentru shortcode-uri.
Mai sunt câteva motive care ne-au determinat să decidem că interfața noastră nu mai era eficientă (sau potrivită nevoilor noastre), dar punctele de mai sus sunt cele principale. Un lucru a fost însă întotdeauna sigur: știam că trebuia să actualizăm interfața.
Definirea modului în care un page builder ar trebui să funcționeze în mod ideal
În loc să ne grăbim și să schimbăm lucrurile imediat, am făcut o sută de pași înapoi pentru a privi întreaga experiență a unui page builder. Am vrut să dăm o nouă viață interfeței. Sincer vorbind, nu am vrut să continuăm să o reconstruim an de an. Este epuizant și cu siguranță nu aduce un ajutor semnificativ comunității WordPress. De data aceasta, am decis să facem lucrurile încet și cu atenție. Am studiat fiecare colț al Page Builder Sandwich și ceea ce îl face un page builder bun și, în cele din urmă, am conturat întreaga experiență de editare în câteva concepte fundamentale.
Concept esențial #1: Tastarea direct în conținut pentru a edita lucruri
Unul dintre motivele principale pentru instalarea unui page builder este eliberarea de constrângerile editorului de text din backend-ul WordPress. Nu că editorul de backend nu ar fi bun, dar când îți creezi paginile web, nu îți arată imediat cum va arăta pagina ta web pentru vizitatorii site-ului și nici nu îți permite să aranjezi conținutul în afara unei machete cu o singură coloană. Acolo îți poți vedea doar textul și câteva imagini, dar nimic din elementele mai elaborate (de exemplu, formularele de contact). Poți adăuga shortcode-uri, da, dar acestea nu vor apărea în forma lor randată*.
* Există pluginuri create de alții pentru a rezolva acest lucru, cum ar fi Shortcake UI, dar asta nu este relevant acum.
Aici intervin instrumentele de creare a paginilor de tip front-end. Acestea scot experiența de editare din backend și o aduc în front-end, editându-ți site-ul exact așa cum îl vor vedea vizitatorii tăi. Așa cum ar spune Pippin: Ce vezi este ceea ce obții (WYSIWYG).
Un alt lucru bun la un editor front-end este că îți permite să editezi textul în mod direct. Tastarea în titluri și paragrafe oferă ușurința utilizării unui procesor de text obișnuit în crearea de site-uri web. Butoanele și etichetele taburilor ar trebui, de asemenea, să poată fi modificate printr-un simplu clic pe ele și tastare.
Acesta este aspectul la care majoritatea celorlalte page buildere nu se descurcă prea bine. Majoritatea te obligă să tastezi într-un câmp de text pentru a edita orice. Din nou, acest lucru nu ar trebui să se întâmple în generatoarele de pagini front-end reale. Tastarea și editarea directă a textului au fost un punct forte al Page Builder Sandwich încă de la versiunea 2 și ne-am asigurat că acest lucru este menținut și în versiunea 3.
Concept esențial #2: Utilizarea mouse-ului pentru ajustări rapide
Mouse-ul este un instrument puternic care este adesea neglijat în page buildere. De multe ori, generatoarele de pagini îl folosesc doar pentru a permite oamenilor să tragă elemente și să le plaseze în diferite locații sau pentru a face clic pe butoane ori câmpuri de introducere. Deși acest lucru este în regulă, există mult mai multe lucruri pe care le poți face cu mouse-ul în ceea ce privește crearea paginilor.
În primul rând, există un feedback vizual excelent în utilizarea mouse-ului ca instrument de editare a paginii, în special în ajustarea proprietăților vizuale precum marginile, spațierile interioare și dimensiunile. Acum, ajustarea elementelor devine o experiență naturală.
În versiunea 3 a PBS, vei putea ajusta o serie de lucruri folosind mouse-ul. Poți ajusta marginile/spațierile dintre elementele individuale, spațierea interioară din coloane, precum și dimensiunile imaginilor, pictogramelor și hărților. De asemenea, am înlocuit butoanele care îți permit să modifici valori numerice cu glisoare.
Concept esențial #3: Textul ar trebui să fie ușor de stilizat
Dacă faci un pas înapoi de la monitor, vei observa că cea mai mare parte a ceea ce adaugi în paginile tale web este conținut de tip text. Da, avem imagini și pictograme pentru a le însoți – și în ultima vreme avem tendința de a adăuga imagini mai mari în site-urile noastre. Dar majoritatea conținutului important este format din text: titluri, liste cu marcatori, paragrafe, citate etc. Alături de acesta este modul în care ne stilizăm textul pentru a se potrivi cu designurile noastre. Fie le schimbăm dimensiunile și culorile, fie le facem aldine sau cursive. Acest lucru este pentru a face conținutul nostru mai lizibil, relevant și atractiv pentru cititorii noștri.
Pentru că stilizăm textul des, butoanele care ne permit să schimbăm stilurile ar trebui să fie foarte accesibile. Nu ar trebui să fie ascunse într-o fereastră pop-up pe care trebuie să o deschidem mai întâi. Majoritatea page builderelor suferă de această problemă. Pentru ca interfața lor de utilizator să fie etichetată drept „aerisită”, chiar și cele mai utilizate opțiuni sunt ascunse la vedere.
Pentru a rezolva acest lucru, ne-am uitat la cele mai utilizate procesoare de text. Am observat că acestea au de obicei un rând cu o mulțime de butoane în partea de sus a ecranului folosite pentru a formata textul și am copiat același aspect pentru versiunea 3. Acum avem un rând cu toate butoanele de stilizare a textului mereu prezente în partea de sus a ecranului. Acest lucru face ca stilizarea să fie foarte rapidă și să devină o a doua natură în editarea textului.
Concept esențial #4: Opțiunile avansate de stilizare ar trebui să fie flexibile, dar ușor de înțeles
Ideea de bază a unui page builder este că ar trebui să le permită oamenilor să creeze designuri uimitoare cu ușurință. Aceasta înseamnă că ar trebui să oferim o mulțime de setări și opțiuni diferite, fără a impune o curbă de învățare dificilă. Posibilitatea de a ajusta marginile, spațierile interioare și de a stiliza textul este grozavă, dar acestea pot face doar până la un punct. Vei avea nevoie de opțiuni mult mai elaborate pentru a finaliza treaba, opțiuni precum imagini de fundal, modele, chenare, fundaluri fixe și multe altele. Aglomerarea tuturor acestor setări diferite poate deveni puțin copleșitoare, așa că le-am simplificat pe unele dintre ele și le-am organizat în categorii pentru a face lucrurile mai prietenoase în versiunea 3.
Concept esențial #5: Suport pentru shortcode-uri
În cele din urmă, să nu uităm că generatorul nostru de pagini este construit pe baza WordPress. Ar trebui să îmbrățișăm platforma și funcționalitățile sale și să nu le restricționăm sau să ne abatem de la ele. O caracteristică uriașă pe care o oferă WordPress sunt shortcode-urile. Nu înseamnă că întregul conținut ar trebui să fie compus din shortcode-uri – ar fi dezordonat –, ci dimpotrivă, ar trebui doar să fim compatibili cu ele. O mulțime de pluginuri și teme folosesc shortcode-uri și ar fi o mare pierdere dacă le-am ignora pe toate. De fapt, shortcode-urile oferă utilizatorilor flexibilitate maximă atunci când vine vorba de crearea paginilor.
Am introdus în urmă cu câteva săptămâni sistemul nostru de mapare a shortcode-urilor și, datorită acestuia, am mapat sute de shortcode-uri de la sute de pluginuri. Am prioritizat cele mai populare pluginuri găsite în directorul de pluginuri WordPress, așa că sunt șanse mari să le întâlnești pe propriile tale site-uri. Acest lucru doar s-a consolidat în versiunea 3 și vom continua să îmbunătățim acest aspect pe viitor.
Concluzie
Am preluat toate aceste proprietăți esențiale de mai sus și le-am integrat în Page Builder Sandwich versiunea 3. Este cel mai bun generator de pagini pe care l-am creat pentru WordPress până acum. Este mai intuitiv și mai natural de utilizat, funcționează mai rapid, este mai ușor de folosit și mai prietenos ca niciodată.
Dacă ai vreo părere despre o funcționalitate esențială pentru un page builder, spune-ne lăsând un comentariu mai jos.