Utforme handlingsark i Sketch – enkle trinn

Utviklingen av mobile applikasjoner krever ikke bare kreative design, men også gjennomtenkte funksjonaliteter. Et effektivt element som gir mange apper et profesjonelt preg, er Action Sheet. I denne veiledningen vil du lære hvordan du kan lage et Action Sheet med iOS-biblioteket for å forbedre brukeropplevelsen. Fokuset ligger ikke bare på design, men også på den praktiske gjennomføringen.

Viktigste funn

Et Action Sheet er et viktig element for å tilby brukerne forskjellige alternativer uten å overbelaste brukergrensesnittet. Det muliggjør enkel interaksjon, spesielt for juridisk informasjon eller påmeldingsmuligheter.

Trinn-for-trinn-veiledning

1. Lag grunnlaget

Før du går videre til spesifikke design og funksjoner, må du sørge for at brukerne kan logge seg inn og ut. Dette inkluderer også juridiske aspekter som visning av vilkår og betingelser eller personvernerklæringer.

2. Lag en ny knapp

Plasser en knapp i øverste høyre hjørne av kontrolleren din. Denne knappen skal brukes til å åpne Action Sheet. Du kan gi den en litt nøytral etikett som tiltrekker brukerne.

3. Tilpass grensesnitt-elementene

For å tydeliggjøre brukerens valg, bør du legge til en etikett med ordet "more". Selvfølgelig kan du bruke tre prikker i stedet for å gjøre det mer visuelt appellerende.

4. Endre designet på kontrolleren

Nå er det viktig å tilpasse grensesnittet. Endre navnet på kontrolleren din og sørg for at det skiller seg tydelig ut i designet. For eksempel kan du kalle det "Profile Controller More".

5. Lag et rektangel for menyen

For å skape en klar avgrensning mellom Action Sheet og resten av appen, lag et rektangel som dekker hele kontrolleren. Gi rektangelet en svart farge med 50% gjennomsiktighet for å oppnå en myk bakgrunn.

6. Forberedelse av Action Sheet

I stedet for å lage en egen meny, kan du bruke de allerede eksisterende malene til å designe ditt Action Sheet. Sjekk alternativene i iOS-biblioteket og velg et enkelt Action Sheet som allerede har ønsket mørk bakgrunn.

7. Tilpass knappene i Action Sheet

Begynn med å tilpasse handlingene i Action Sheet. Behold "Cancel"-knappen og legg til en utloggingsknapp rett over for å gi brukerne en enkel måte å logge ut på.

8. Bruk designalternativer for knapper

Optimaliser designet på utloggingsknappen ved å sette den til "destructive". Dette gir knappen en rød farge som fremhever den og oppfordrer brukerne til å utføre denne handlingen med omhu.

9. Legg til ekstra handlinger

Etter at de grunnleggende funksjonene er laget, kan du legge til flere alternativer. Tenk på hvilken informasjon som kan være nyttig for brukerne, for eksempel ofte stilte spørsmål, varselinnstillinger eller lenker til vilkår og betingelser samt personvernerklæringer.

10. Fullføring av menyen

Sjekk til slutt om alle funksjoner og alternativer du planla er tilstede i Action Sheet. Med en klar liste over alternativer hjelper du utvikleren med å designe appen effektivt og oppfylle alle juridiske krav.

Oppsummering – Lage Action Sheets i Sketch

I denne veiledningen har du lært hvordan du lager et Action Sheet i Sketch for effektivt å bruke det i en app. Action Sheet tilbyr ikke bare ulike alternativer for brukerinteraksjon, men oppfyller også vesentlige juridiske krav.