ZAPTEST hjälper utvecklare att automatisera sina mockups så tidigt som möjligt. Denna funktion gör det möjligt för teamen att anta en Agile/DevOps-strategi under designstadiet, så att de kan börja på det sätt som de avser att fortsätta.
Vikten av mockups
Mockups är en viktig del av bra UI/UX-design. De är så mycket mer än bara nästa steg efter wireframes. Istället erbjuder de utvecklare och designers ett sätt att konceptualisera sin produkt och omvandla den till något konkret.
Genom att använda mockups under utvecklingsfasen kan du snabbt införliva feedback. Dessa högupplösta representationer av din slutprodukt är tillräckligt realistiska för att du ska få en bra känsla för hur din framtida applikation kommer att se ut och kännas.
Mockups är också ett bra sätt för intressenter eller investerare att se om produkten uppfyller deras förväntningar. Det viktigaste är att om du får feedback som innebär att du behöver göra ändringar är det enkelt att införliva dessa nya åsikter i din mockup långt innan du har skrivit en rad kod.
ZAPTEST mockup-baserad automatisering
När du har levererat en mockup som alla är nöjda med kan du gå vidare till nästa steg. Men en sann Agile/DevOps-metod innebär automatiserad testning så tidigt som möjligt. Nu kanske du undrar: “Hur kan jag automatisera testning när jag bara är i designfasen?” På ZAPTEST förstår vi att kontinuerlig testning bör börja så tidigt som möjligt, vilket är anledningen till att vi erbjuder mockup-baserad automatisering.
I det här avsnittet visar vi hur du kan generera testskript och dokumentation från din mockup och parallellt testa den på olika operativsystem.
Steg 1: Från mockup till testskript
Du kan designa mockups på en mängd olika sätt. Du kan rita dem för hand eller använda populära designverktyg som Figma eller Placeit. Oavsett vilken metod du föredrar tar du din slutprodukt och använder ZAPTESTs scan GUI-funktion för att importera den till vår plattform.
Scan GUI-funktionen känner av all text i din mockup och skapar automatiskt relaterade objekt. Dessutom skapar automatisk förankring relationer mellan textfält i din mockup och etiketter i skriptet. Resultatet av detta är att om du flyttar en specifik text runt på skärmen kommer alla relaterade element automatiskt att följa den. Om du t.ex. har en modell av en inloggningsskärm kan du ansluta ett “Användarnamn”-objekt till ett textfält.
I detta skede kan du dessutom ändra standardnamnen för objekten för att säkerställa att de är så tydliga som möjligt. Denna funktion är särskilt användbar om du har många olika knappar på din mockup.
Som ett resultat av denna process lagras och organiseras alla objekt i Repository Explorer.
Steg 2: Lägga till objekt i skriptet
När du har importerat och märkt din mockup är det dags att förvandla den till ett testskript.
För att definiera ett steg i ZAPTEST-skriptet behöver du bara leta upp objektet i GUI Map eller Object Repository och dubbelklicka på det. Eller så kan du dra och släppa objekt till en specifik plats i ditt manus. ZAPTEST kommer att föreslå en lista över operationer att välja mellan för steget.
Det första du behöver göra är att lägga till ett valideringssteg som verifierar att din målsida existerar. Därefter måste du välja “TYP” och lägga till varje element från din mockup (dvs. ett anslutet “användarnamn” och ett textfält).
Sedan kan du lägga till “KLICKA” för alla knappar i din mockup som dina användare kan välja.
Slutligen, när din applikation är redo att testas, väljer du en webbläsare, väljer LAUNCH och skriver in appens adress. Nu kan du köra ditt skript mot appen.
Steg 3: Kör skriptet
ZAPTEST mockup testautomatisering är så kraftfull att skriptet körs första gången utan behov av några ändringar. Nu kan du testa din mockup från din webbläsare och få en verklig känsla för användarupplevelsen av din applikation, helt utan att skriva någon kod.
När skriptet är klart kan det läggas till i din CI/CD-pipeline och användas i ditt ramverk för kontinuerlig testning.
Denna funktion sparar naturligtvis mycket tid. Dessutom innebär det att icke-tekniska designmedarbetare kan omvandla sina idéer till funktionella applikationer på några minuter – inga fler väntetider för att få idéer på fötter.
Men tidsbesparingarna stannar inte där; ZAPTEST mockup automation gör det också möjligt för dig att skapa dokumentation.
1. Skapa dokumentation
Med ZAPTEST kan du skapa testdokumentation med ett enkelt klick på en knapp. Dokumentationen är uppdelad i detaljerade steg med ett avsnitt för förväntade resultat. Det bästa är att du kan konvertera dessa dokument till en mängd olika format, t.ex. Word, PDF, HTML, XML och CSV. Dessutom kan du exportera till Micro Focus ALM, Rally (eller CA Agile Center), Jira, o Azure DevOps och många andra. Alternativen är oändliga.
2. Parallellt utförande
Det sista steget för vår mockup-baserade testautomatisering är att använda ZAPTEST M-RUN. Med våra kraftfulla verktyg för testautomatisering kan användarna köra flera skript samtidigt på flera olika plattformar. Användarna har tillgång till applikationerna via olika enheter och operativsystem, så det är absolut nödvändigt att testa alla dessa egenskaper.
Några av de plattformar som ZAPTEST M-RUN låter dig testa mot är Android, iOS, Mac, Linux och Windows. Du kan ansluta ZAPTEST till fysiska enheter i verkligheten och använda vår plattform för att köra testet och hantera resultaten. Denna process bygger också på ZAPTEST 1SCRIPT Implementation, som underlättar testning och körning på olika plattformar utan att man behöver ändra automatiseringskoden för att passa varje enskild fastighet.
Live remote view gör att du kan övervaka testerna parallellt. När testet är klart kan du granska resultaten för varje enskild enhet. Dessa data hjälper till att säkerställa att din applikation kan köras smidigt på de olika enheter som dina intressenter använder.
Avslutande tankar
Som alla programutvecklare vet kommer testningen ofta för sent. Att implementera testning i ett senare skede av programvarans utvecklingscykel kan avslöja problem som borde ha upptäckts tidigare, vilket leder till dyra omskrivningar av koden. Men det kan också göras för sent och orsaka stora förseningar under livscykeln för programvaruutveckling (SDLC).
Mockup-design är ett bra sätt att identifiera UI/UX-problem tidigt. Men för Agile/DevOps-team är de också en möjlighet att implementera kontinuerlig testning så snart som möjligt. Tack vare ZAPTEST:s Computer Vision-teknik kan du nu importera dina handritade eller datorgenererade mockups, konvertera dem till kod och testa dem mot de olika enheter som dina intressenter använder.
Därifrån kan du generera dokumentation och testresultat som kompletterar UI/UX-feedbacken och säkerställer att din applikation får den bästa starten.
