10 buwan na ang nakalipas mula nang ilabas namin ang Page Builder Sandwich sa publiko. Mayroon na kaming humigit-kumulang 6,000 aktibong pag-install, at isa itong malaking tagumpay para sa amin. Nakatanggap din kami ng napakaraming feedback dahil dito, kapwa maganda at masama. Gayunpaman, ang pangkalahatang opinyon ay nasisiyahan ang mga tao sa kung gaano kadaling gumawa ng mga layout at lumikha ng kanilang nilalaman kumpara sa iba pang mga page builder diyan.
Malaking bahagi ng feedback na natanggap namin ay mga hiling na feature, at nagdagdag kami ng marami sa mga feature na iyon nitong mga nakaraang buwan. Ngunit habang patuloy naming ginagawa iyon, unti-unti rin naming binabago ang user interface sa proseso. At, dahil dito, binabago rin namin ang karanasan ng gumagamit… para sa ikalulubha nito. Dumating na nga sa punto na kailangan na naming pag-isipang muli ang interface, dahil hindi na ito gumagana nang maayos, at hindi na rin bumabagay ang iba’t ibang feature dito.
Ang Lumang Interface
Sa mga naunang bersyon ng PBS, nais namin na ang lahat ay nasa anyo ng mga button. Bakit? Dahil madaling gamitin ang mga button. I-ki-click mo lang… ang mga ito. Sa mga mas lumang bersyon ng inspector (ang sidebar sa imahe sa itaas), ang pag-click sa isang button ay magpapataas ng halaga, pagkatapos ang shift+click sa isang button ay magpapababa rito. Mukhang madali lang iyon. Ngunit sa pagdaragdag ng mga carousel, tab, mapa, at iba pang bagong elemento at feature, ang lahat ng mga button na iyon ay naging halo-halong iba’t ibang icon na may iba’t ibang disenyo, at medyo nagsimula nang magmukhang hieroglyphics kaysa sa isang magandang interface. Hindi ito problema para sa mga sanay nang gumagamit, ngunit medyo nakakatakot itong tingnan kung bago ka pa lang sa PBS.
Kasunod nito, may ilang problema na lumitaw sa inspector. Ang orihinal na ideya ay gawing simple ang lahat at available sa loob ng inspector. At sa salitang lahat, ang ibig kong sabihin ay lahat – mula sa paggawang heading ng teksto, hanggang sa pagpapalit ng mga kulay ng background, mga kulay ng font, at kung ano-ano pa. Gayunpaman, sa kasalukuyang kalagayan nito, ang inspector ay naglalaman na ngayon ng napakaraming opsyon na magpapagamit sa iyo ng mouse wheel upang patuloy na mag-scroll pataas at pababa. Ibang-iba sa inspector na dati kong inasahang gawin para sa mga gumagamit.
Panghuli, ipinakilala namin kamakailan ang shortcode mapping para sa iyong mga paboritong plugin. Hiningi ng feature na ito na gumawa kami ng mga text field, number slider, checkbox, at karagdagang mga bagong uri ng opsyon na kailangan upang gawing mas magaan ang iyong karanasan sa pag-edit ng shortcode. Noong una, magandang ideya ito, at oo, ginawa nitong mas madali para sa iyo ang pagmamanipula ng mga shortcode. Ngunit muli, ang feature na ito ay lumihis mula sa aming interface na “mga button lamang.” Kung iisipin, talagang imposibleng gumamit lamang ng mga button para sa pagbabago ng mga attribute ng shortcode. Ngayon, sa pinakabagong bersyon, nauwi kami sa 2 uri ng mga kontrol: ang mga button at ang mga field ng shortcode.
May ilan pang dahilan kung bakit kami nagdesisyon na ang aming interface ay hindi na epektibo (o angkop sa aming mga pangangailangan), ngunit ang mga punto sa itaas ang mga pangunahin. Gayunpaman, isang bagay ang laging tiyak: alam naming kailangan naming i-update ang interface.
Pagtukoy Kung Paano Dapat Tamang Gumana ang Isang Page Builder
Sa halip na agad sumabak at magpalit ng mga bagay-bagay, umatras kami nang malayo upang suriin ang kabuuang karanasan sa page builder. Nais naming magbigay ng bagong buhay sa interface. Sa totoo lang, ayaw naming patuloy itong buuing muli taon-taon. Ito ay nakakapagod at tiyak na hindi nagdudulot ng malaking tulong sa komunidad ng WordPress. Sa pagkakataong ito, nagpasya kaming gawin ang mga bagay nang dahan-dahan at maingat. Pinag-aralan namin ang bawat sulok ng Page Builder Sandwich at kung ano ang nagpapaganda rito bilang page builder, at sa wakas ay nabuo ang buong karanasan sa pag-edit sa ilang pangunahing konsepto.
Mahalagang Konsepto #1: Direktang Pag-type sa Iyong Nilalaman para Mag-edit ng mga Bagay
Isa sa mga pangunahing dahilan sa pag-install ng page builder ay ang makawala sa mga limitasyon ng backend text editor ng WordPress. Hindi naman sa hindi maganda ang backend editor, ngunit kapag gumagawa ng iyong mga webpage, hindi nito agad ipinapakita sa iyo kung ano ang magiging hitsura ng iyong webpage sa mga bisita ng iyong site, at hindi ka rin nito pinapayagang mag-layout ng iyong nilalaman sa labas ng one-column na layout. Makikita mo lamang ang iyong teksto doon at ilang mga imahe, ngunit wala sa mas detalyadong mga bagay (hal. mga contact form). Maaari kang magdagdag ng mga shortcode, oo, ngunit hindi lalabas ang mga ito sa kanilang nai-render na anyo*.
* May mga plugin na ginagawa ng iba upang tugunan ito tulad ng Shortcake UI, ngunit iba nang usapan iyon.
Doon pumapasok ang mga front end page builder. Inilalabas nila ang karanasan sa pag-edit mula sa backend patungo sa front end, kung saan ini-edit mo ang iyong site ayon sa kung paano talaga ito makikita ng iyong mga bisita. Gaya ng sasabihin ni Pippin: Ang nakikita mo ang siyang nakukuha mo (WYSIWYG).
Isa pang magandang bagay sa pagiging frontend editor ay pinapayagan ka nitong direktang i-edit ang iyong teksto. Ang pag-type sa mga heading at talata ay nagbibigay ng kaginhawahan ng paggamit ng karaniwang word processor sa paggawa ng website. Dapat ding mababago ang mga button at label ng tab sa pamamagitan lamang ng pag-click sa mga ito at pag-type.
Ito ang bahaging hindi masyadong naibibigay ng karamihan sa iba pang mga page builder. Pinipilit ka ng karamihan sa kanila na mag-type sa loob ng isang text field para i-edit ang lahat. Muli, hindi dapat ganito ang kalagayan sa mga tunay na frontend page builder. Ang direktang pag-type at pag-edit ng teksto ay naging kalakasan ng Page Builder Sandwich mula noong bersyon 2, at tiniyak namin na mapapanatili pa rin ito sa bersyon 3.
Mahalagang Konsepto #2: Paggamit ng Mouse para sa Mabilisang Pag-aayos
Ang mouse ay isang makapangyarihang tool na kadalasang napapabayaan sa mga page builder. Kadalasan, ginagamit ito ng mga page builder upang payagan ang mga tao na i-drag ang mga bagay-bagay at i-drop ang mga ito sa iba’t ibang lokasyon, o mag-click sa mga button o input field. Bagama’t ayos lang ito, marami ka pang magagawa gamit ang mouse pagdating sa paggawa ng page.
Una sa lahat, may kahanga-hangang visual na feedback sa paggamit ng mouse bilang tool sa pag-edit ng page, lalo na sa pagsasaayos ng mga visual property tulad ng mga margin, padding, at laki. Ngayon, nagiging natural na karanasan na ang pag-aayos ng iyong mga elemento.
Sa PBS bersyon 3, makakapag-adjust ka ng ilang mga bagay gamit ang iyong mouse. Maaari mong i-adjust ang mga margin/espasyo sa pagitan ng mga indibidwal na elemento, ang mga padding sa loob ng iyong mga column, pati na rin ang mga laki ng mga imahe, icon, at mapa. Pinalitan din namin ang mga button na nagbibigay-daan sa iyo na magbago ng mga numerical value para maging mga slider.
Mahalagang Konsepto #3: Dapat Madaling I-style ang Teksto
Kung aatras ka mula sa iyong monitor, mapapansin mo na karamihan sa idinaragdag mo sa iyong mga webpage ay text content. Oo, mayroon tayong mga imahe at icon doon upang sumama sa mga ito – at nitong mga nakaraang panahon ay madalas tayong magdagdag ng mas malalaking imahe sa ating mga site. Ngunit ang karamihan sa mahalagang content ay puro teksto: mga heading, bullet list, talata, quote, atbp. Kasabay nito kung paano natin ini-istilo ang ating teksto upang umangkop sa ating mga disenyo. Maaari nating baguhin ang kanilang mga laki at kulay, o gawing bold o italicized. Ito ay para maging mas madaling basahin, may kaugnayan, at kaakit-akit ang ating content sa kani-kanilang mga mambabasa.
Dahil madalas nating i-style ang teksto, ang mga button na nagpapahintulot sa atin na magbago ng mga estilo ay dapat napakadaling ma-access. Hindi dapat nakatago ang mga ito sa loob ng isang pop-up box na kailangan pa nating buksan muna. Karamihan sa mga page builder ay naghihirap sa sakit na ito. Upang matawag ang kanilang user interface na ‘clutter-free’, maging ang pinakaginagamit na mga opsyon ay itinatago sa paningin.
Upang malutas ito, tiningnan namin ang mga pinakakaraniwang ginagamit na word processor. Napansin namin na karaniwan silang may isang hanay na may napakaraming button malapit sa tuktok ng screen na ginagamit sa pag-format ng teksto at kinopya ang parehong layout para sa bersyon 3. Mayroon na kaming isang hanay ng lahat ng mga button sa pag-istilo ng teksto na palaging naroroon sa tuktok ng iyong screen. Ginagawa nitong napakabilis ang pag-istilo at parang natural na sa iyong pag-edit ng teksto.
Mahalagang Konsepto #4: Ang mga Advanced Styling Option ay Dapat Flexible Ngunit Madaling Maintindihan
Ang pinakabuod sa isang page builder ay dapat nitong payagan ang mga tao na lumikha ng mga nakamamanghang disenyo nang madali. Nangangahulugan ito na dapat kaming magbigay ng maraming iba’t ibang setting at opsyon nang hindi nagiging mahirap matutunan. Ang kakayahang mag-adjust ng mga margin, padding, at mag-istilo ng teksto ay mahusay, ngunit hanggang doon lamang ang magagawa ng mga iyon. Kakailanganin mo ng mas detalyadong mga opsyon upang matapos ang trabaho, mga opsyon tulad ng mga background image, pattern, border, fixed background, at marami pa. Ang pagsasalansan ng lahat ng iba’t ibang setting na iyon ay maaaring maging medyo nakakalula, kaya pinasimple namin ang ilan sa mga ito at inayos ang mga ito sa mga kategorya upang gawing mas magiliw ang mga bagay sa bersyon 3.
Mahalagang Konsepto #5: Suporta sa Shortcode
Panghuli, huwag nating kalimutan na ang ating page builder ay nakatayo sa ibabaw ng WordPress. Dapat nating yakapin ang platform at ang mga feature nito at huwag limitahan o lumihis mula sa mga ito. Isang napakalaking feature na ibinibigay ng WordPress ay ang mga shortcode. Hindi ito nangangahulugan na ang buong content ay dapat buuin ng mga shortcode – magiging magulo iyon – kundi dapat tayong maging compatible sa mga ito. Maraming plugin at theme ang gumagamit ng mga shortcode, at magiging malaking kawalan kung babalewalain ang lahat ng ito. Sa katunayan, nagbibigay ang mga shortcode sa mga gumagamit ng sukdulang flexibility pagdating sa paglikha ng mga page.
Ipinakilala namin ilang linggo na ang nakalilipas ang aming shortcode mapping system, at dahil dito ay na-map namin ang daan-daang shortcode mula sa daan-daang plugin. Binigyan namin ng priyoridad ang mga pinakasikat na plugin na matatagpuan sa directory ng plugin ng WordPress, kaya malamang na makaharap mo ang mga ito sa sarili mong mga site. Ito ay lalo lamang pinalakas sa bersyon 3, at patuloy naming pagbubutihin ito sa hinaharap.
Konklusyon
Kinuha namin ang lahat ng mahahalagang katangian sa itaas at binuo ang mga ito sa Page Builder Sandwich bersyon 3. Ito ang pinakamahusay na page builder na binuo namin para sa WordPress sa ngayon. Ito ay mas madaling maunawaan at mas natural gamitin, mas mabilis gumana, mas madaling gamitin, at mas palakaibigan kaysa dati.
Kung mayroon kang anumang saloobin sa isang mahalagang feature ng page builder, ipaalam sa amin sa pamamagitan ng pagkomento sa ibaba.