Produktdesign och UX/UI för webbappar och SaaS

Produktdesign är det UX- och UI-arbete som avgör hur en webbapp eller SaaS-produkt beter sig: vilken uppgift som kommer först, vad varje skärm visar och hur gränssnittet svarar när något går rätt eller fel. Dardo utformar sådana system åt grundare och produktteam, från MVP-gränssnitt till nya funktioner, och kan även bygga dem. Du får flöden, prototyper och komponenter som era utvecklare kan implementera utan att gissa.

Skriv till oss på WhatsApp
Dardo / Redaktionell illustration
På den här sidan

Produktdesign eller webbdesign: vilket behöver du?

En marknadsföringssajt förklarar ett erbjudande och leder till en förfrågan. En produkt används om och om igen för att få saker gjorda, så den måste hantera konton, behörigheter, verkliga data och alla lägen däremellan. Produktdesign tar hand om det andra uppdraget: flödena, informationsarkitekturen, komponenterna och återkopplingen som gör ett verktyg begripligt första gången och snabbt för hundrade gången.

Om du behöver en sajt som presenterar ditt företag, börja med skräddarsydd webbdesign. Om produkten mest består av diagram, kartor eller operativa dashboards går vår tjänst för datavisualisering djupare in på det. Många SaaS-team behöver båda, och vi avgränsar dem som separata leveranser så att var och en kan godkännas på sina egna villkor.

Vad ett produktdesignuppdrag omfattar

Offerten anger vilka faser som ingår, vem som levererar underlag och hur varje leverans godkänns.

  • Kartläggning av kärnuppgifter och flöden, inklusive roller och behörigheter
  • Informationsarkitektur och navigation
  • Interaktiva prototyper som granskas med realistiskt innehåll
  • UI-komponenter med tomma, laddande, felande och behörighetsrelaterade lägen
  • Innehållsregler och tillgänglighetslägen för varje komponent
  • Implementationsspecifikationer och granskning av det byggda gränssnittet

Att utforma en MVP kring en verklig uppgift

Börja med en konkret uppgift, som att skicka in ett bidrag, hitta en post eller jämföra alternativ, och definiera framgång i observerbara termer. Vi kartlägger de personer, behörigheter, uppgifter och beslut som berörs. Supportsamtal, produktdata och analysdata kan visa var ett befintligt flöde brister. När sådana belägg ännu inte finns kallar vi antaganden för antaganden och planerar riktad förstudie i stället för att presentera dem som forskningsresultat.

Varje flöde ritas för första användning, återkommande användning, tomma data, fel, avbrott, bekräftelse och återhämtning. Den inventeringen av lägen gör den verkliga arbetsinsatsen synlig tidigt och hindrar att ett snyggt idealflöde blir hela specifikationen.

Prototypa de beslut som är svåra att ångra

Prototypen fokuserar på navigation, terminologi, datatäthet, responsivt beteende och återkopplingen efter varje handling. Granskarna arbetar sig igenom definierade uppgifter med realistiskt innehåll, så att feedbacken knyts till vad människor kunde eller inte kunde slutföra och inte bara till tycke och smak. En prototyp är belägg för det designade beteendet. Användning och intäkter mäts efter lansering, och vi lovar dem inte i förväg.

Superame: design av en offentlig projektranking

Dardo har designat och utvecklat Superame, en produkt som gör upptäckten av projekt till en synlig tävling. En topplista skapar brådska men också misstro när placeringar ändras utan förklaring, så rankingen är det centrala objektet, med stöd av en stabil projektidentitet, vyer för upptäckt och en enkel förklaring av hur man deltar. Designen behandlar upptäckt, inskick och återkoppling som en sammanhängande resa, och mobila interaktioner är utformade för att ge likvärdig återkoppling utan att förlita sig på hover.

Det är en fungerande produkt, inte en mockup. Astro-applikationen lagrar rankingen i en Neon-databas och skickar köpare till Dodo Payments värdbaserade kassa. Servern verifierar signerade betalningsanrop innan tillgodohavande läggs till och tillämpar samma idempotenta bokföring på återbetalningar och tvister. Siffror för deltagande, retention och intäkter förblir opublicerade tills en daterad produktrapport har godkänts.

Från prototyp till fungerande mjukvara

Överlämningen omfattar komponenter, lägen, innehållsregler och implementationsanteckningar. Vi kommer överens om vilka frågor som kräver input från utveckling eller policy, vem som godkänner dem och hur det byggda gränssnittet ska kontrolleras mot prototypen. Dardo kan implementera webbgränssnittet eller arbeta vid sidan av era utvecklare. Ansvar för arkitektur, backend, säkerhet och data avgränsas separat så att ingen utgår från att de ingår.

Kostnad och samarbete med ett litet, senior team

Kostnaden styrs av antalet användarroller och kärnflöden, vilka lägen varje skärm måste hantera, hur mycket förstudie eller testning du behöver och om Dardo även bygger gränssnittet. Förfrågningsformuläret frågar efter en budgetnivå, från under 5 000 USD till 60 000 USD och uppåt, och vi anpassar omfattningen efter den i stället för att sälja fasta skärmpaket.

Dardo är ett team på tre personer i Bogotá, Colombia, lett av grundaren Nicolás Cerón. Du arbetar direkt med de som gör designen, på engelska eller spanska, och Bogotás tidszon UTC−5 motsvarar arbetstiderna på USA:s östkust och i centrala USA. För nordamerikanska produktteam gör det nearshore-samarbete praktiskt: granskningar och beslut sker samma dag.

Frågor inför ditt val

Vad gör en produktdesignbyrå?

En produktdesignbyrå planerar och designar hur en digital produkt fungerar: uppgiftsflöden, informationsarkitektur, gränssnittskomponenter, prototyper och de specifikationer som utvecklarna bygger från. Vissa bedriver också research eller bygger själva produkten. Hos Dardo kan ett uppdrag sträcka sig från att kartlägga ett centralt flöde till att designa och implementera ett webbgränssnitt, och offerten anger exakt vilka steg som ingår.

Vad kostar UX/UI-design för en MVP?

Det beror på antalet användarroller, centrala flöden och gränssnittslägen, samt hur mycket research och testning ni behöver. Vi lämnar offert efter att ha kartlagt kärnuppgiften i stället för att prissätta per skärmbild, eftersom ett flöde med komplexa behörigheter kan väga tyngre än tio enkla sidor. Budgetnivåerna i vårt förfrågningsformulär, från under 5 000 USD till över 60 000 USD, hjälper oss att dimensionera den första offerten.

Hur lång tid tar det att designa en MVP?

Det beror på hur många flöden och lägen den första versionen behöver. Vi sätter delmål i offerten efter att ha kartlagt kärnuppgiften, och det första delmålet är en prototyp av den uppgiften med tomma lägen och felmeddelanden, vilket tidigt visar om planen håller. Om ni har ett lanseringsdatum eller en kapitalrunda att förhålla er till, berätta det från start så att uppdraget kan delas upp i faser.

Behöver vi ha användare eller research innan vi börjar?

Nej. Befintligt underlag som supportärenden, analysdata eller intervjuer är värdefullt, men många MVP:er startar utan det. Vi utgår från vad ert team vet, skriver ner antaganden som just antaganden och väljer fokuserad research eller prototyptester utifrån risken. Det vi undviker är att presentera gissningar som resultat.

Vad är skillnaden mellan produktdesign, UX-design och UI-design?

UX-design formar struktur och flöde: vad människor behöver göra och i vilken ordning. UI-design formar gränssnittet de ser och använder: layout, komponenter, typografi och återkoppling. Produktdesign kombinerar båda med produktbeslut, till exempel vad den första versionen ska innehålla och hur framgång mäts. I ett litet team som vårt täcker samma personer alla tre, så beslut går inte förlorade i överlämningar.

Kan Dardo också bygga produkten?

Ja, när det gäller webbgränssnitt. Vi kan implementera frontend eller arbeta med era utvecklare, och Superame är en produkt som vi har designat och utvecklat ända fram till betalflödet. Arkitektur, backend, säkerhet och dataansvar avgränsas separat från gränssnittsdesignen, så offerten anger tydligt vem som ansvarar för vad.

Designar ni dashboards och adminpaneler?

Ja, som en del av produktens flöden: navigation, tabeller, filter, behörigheter och lägena runt dem. När kärnan i arbetet är att visualisera data, till exempel diagram, kartor eller rankingar med källor och enheter, är vår tjänst för datavisualisering en bättre startpunkt. Produkter som behöver båda får ett gemensamt uppdrag med delade komponenter.

Relaterat arbete och fallstudier

superame.lol: publicerat projektgränssnittFungerande produkt / Ranking och deltagandesuperame.lolGranska den offentliga rankingen och deltagarflödet tillsammans med de dokumenterade produktlägena. Fallet skiljer implementerat beteende från omätt användning och intäkter.Granska projektet

Börja med en verklig produktuppgift

Kartlägg ett kärnflöde, dess felscenarier och måttet på framgång. Granska Superames publicerade gränssnitt och gör produktbeslutet till en testbar brief.