Iteration på WordPress Administration Screen Design

Idén med en "iterativ process" är inget nytt inom mjukvaruutveckling. Den finns i ett antal olika metoder och troligen för att den fungerar bra, särskilt när man får feedback från kunder.

En av de ställen som jag också tycker är användbar är när jag bygger administrationsgränssnitt för WordPress-plugins.

För att vara tydlig, jag är ingen designer, så när det kommer till front-end-arbete, hänvisar jag alltid till stilguiden och de modeller som designern ger mig från början av projektet. (Jag nämner detta bara för att jag tycker att det är en praxis som alla som inte är designer bör följa, men jag avviker).

Men när det kommer till att arbeta med administrationsskärmar eller back-end-skärmar för WordPress, tenderar jag att följa en strikt regel: Se till att det ser så naturligt ut som möjligt.

Hur har iterativ utveckling och gränssnittet för WordPress administrationsskärmar något med varandra att göra?

WordPress administration skärmdesign

Denna speciella artikel avstår från att prata om saker som förväntas för att spara information. Det vill säga, jag antar alla:

• sanering,
• godkännande,
• icke-kontroller,
• tillståndskontroller,

Och liknande förstås och hanteras.

För det här inlägget ska jag hålla det enkelt. Låt oss säga att vi vill ha:

• ett par textfält,
• en spara-knapp,
• en återställningsknapp,
• och kanske något extra på slutet.

Hur kan detta utspela sig genom en iterativ process när man designar den?

1 Skissa det

Säg att du håller på med något och planerar hur den administrativa skärmen ska se ut. Med tanke på vad vi hade ovan kanske en första skiss kan se ut så här:

Lätt nog, eller hur? Det representerar vad projektet behöver underhålla, och det visar allt vi behöver för just den här administrationsskärmen.

2 Bygga det

När den väl har satts ihop ska den se så naturlig ut som möjligt. Med tanke på de stilar vi har tillgängliga i WordPress är det relativt enkelt att bygga detta med tillgängliga API:er och uppmärkning:

Och vad gör varje fält och knapp?

3 Förfina det

Det är här förfining av funktionaliteten kommer in i bilden. Till exempel:

• Jag tror inte att knappen Spara ska aktiveras förrän de obligatoriska fälten är ifyllda,
• Jag tror att återställningsknappen borde ta bort det som finns,
• Det bör finnas en viss grad av felmeddelanden som alla representerar vad det är vi behöver göra när något misslyckas, när något kanske inte stämmer eller något är helt fel.

Uppenbarligen är det mycket lättare att prata om detta när det inte hänvisar till ett specifikt projekt men kanske några av idéerna är tillämpliga i vad det än är du har på gång.

Asynkrona förbättringar?

En av de saker vi har vant oss vid med enheter som våra telefoner och vissa delar av våra operativsystem är att när vi växlar eller gör en liten förändring sparas data.

Det vill säga, ingen bekräftelseåtgärd (annat än något destruktivt som att ta bort en fil, naturligtvis) krävs. Data sparas helt enkelt och alternativet fungerar.

Ändå ser vi fortfarande många Spara -knappar i WordPress, eller hur? Vad sägs om att spara ingångar via Ajax eller annan asynkron metod? Det här är något jag ännu inte har implementerat men jag har verkligen övervägt det.