The Mighty Ellipsis

Hvordan 3 små prikker kan sige så meget

Når jeg fortæller folk, at ellipsen (…) er den mest fantastiske karakter nogensinde, ser de fleste på mig, som om jeg er skør. Før du mærker mig en galning, så lad mig prøve at forklare.

I årtier bruger interface-designere ellipsen til at kommunikere alle slags vigtige detaljer til brugerne. Som du snart ser, kan disse 3 prikker pakke en hel del mening på bare lidt plads.

Lad os se på 5 forskellige måder ellipser er blevet brugt i interface design gennem årene. I slutningen kan du måske bare udvikle en nyvundet påskønnelse af denne mægtige lille karakter.

1. Ellipsis = "Der er en opfølgende beslutning"

Første gang jeg husker at se en ellipsis i en grænseflade var på Windows 3.1. Det var min første computer. Ellipses dukkede op med et par knapper og menuindstillinger, og det betød, at der var en opfølgningsbeslutning, jeg var nødt til at tage, efter at have klikket på den.

Ellipser var nyttige her, fordi det forsikrede mig om, at handlingen ikke ville ske med det samme. Jeg kunne starte handlingen, men derefter annullere den, hvis jeg skiftede mening.

Dette ellipsemønster findes stadig på Windows og Mac i dag, men det bruges langt mindre i dag.

Se på hvor langt vi er kommet i 2 årtier:

Windows NT (1993): Ellipses overalt!Windows 8 (2013): Hvor gik ellipsen?

Googles retningslinjer for materialedesign anbefaler, at man undlader ellipser fra menupunkter og knapper. Det skyldes sandsynligvis, at mange valgmuligheder alligevel kræver en opfølgningsbeslutning, og at bruge ellipser overalt ville bare skjule grænsefladen.

Dette ellipsemønster går muligvis ud af stil, men jeg tror, ​​det gjorde et ædelagt job at hjælpe folk med at tage beslutninger i alle disse år - og alt det krævede var 3 små prikker.

2. Ellipsis = “Skriv her”

I de senere år har mange produkter brugt ellipser til at indikere tekstfelter. Det er alt det vrede i dag.

Jeg ved ikke, hvem der startede denne trend, men det tidligste eksempel, jeg kunne finde, er fra Facebook i 2008:

Hvorfor skulle nogen bruge en ellipsis som denne? Min gæt er, at ellipsen tjener to formål her:

  1. Visuel effekt: Nogle gange er det svært at bemærke et tekstfelt blandt alt andet på siden, så en ellipsis tilføjer tekstfeltet visuel fremtrædelse. Det bruges til at fange din opmærksomhed.
  2. Psykologisk effekt: Traditionelt indikerer en ellipsis en mangel på ord. Det betyder, at der mangler noget her. På en måde skubber ellipsen dig ind til at udfylde blanket ved at indtaste dine egne ord.

Nogle typeguider anbefaler endda at bruge ellipser til alle tekstfelter. Se Salesforce Style Guide som et eksempel. Jeg personligt kan ikke lide at bruge en ellipsis på denne måde, men den indfanges klart som en designtrend.

Uden megen fanfare er ellipsen hurtigt blevet et symbol for "type her."

3. Ellipsis = “Flere handlinger”

Flere og flere apps bruger nu en midline ellipsis (⋯) til at indikere en menu med flere handlinger. Det betyder dybest set "Hej, der er flere ting du kan gøre her."

I mange Android-apps ser du ofte en lodret ellipsis (⋮) for at betyde den samme ting.

Nogle mennesker kan ikke lide dette design, fordi det muligvis skjuler vigtige handlinger i din app. Uanset om du kan lide dette design eller ej, kan du ikke benægte, at dette symbol er blevet en varm trend inden for UI-design - ligesom hamburger-knappen fra et par år siden.

Tilbage i dag ved jeg, at ingen troede, at en ellipsis kunne betyde "flere handlinger." Og alligevel har ellipsen pludselig påtaget sig dette nye ansvar i de senere år, og der er ikke noget tilbage igen.

Når interface-designere stræber efter enkelhed, vil disse ellipser sandsynligvis blive mere og mere fremtrædende i apps overalt.

4. Ellipsis = “Vent et par sekunder”

En anden almindelig anvendelse til ellipser er at vise, at en handling er i gang. "Indlæser ..." "Opretter forbindelse ..." "Uploader ..." Du har sandsynligvis set dette mønster hundreder af gange.

Forestil dig nu, hvad der ville ske, hvis vi ikke brugte en ellipsis her. Fordi vi er så vant til at se en ellipsis til løbende handlinger, kan vi måske tro, at noget er galt, når vi ikke ser en ellipsis.

Ser det ikke ud til, at der ikke er noget her? I det mindste for mine øjne beroliger brug af en ellipsis mig, at der sker noget i baggrunden. Manglen på en ellipsis får mig til at tro, at noget sidder fast.

Mange designretningslinjer anbefaler at bruge en animation, hvis brugeren har brug for at vente. Men så længe brugeren kun behøver at vente et par sekunder, tror jeg, at en ellipsis kan være en anden nyttig indikator for, at systemet gør sine ting.

På en eller anden måde forsikrer det at bruge 3 prikker i slutningen af ​​et ord mig, at en handling er i gang - selvom de bare er 3 statiske prikker. Er det ikke så forbløffende?

5. Ellipsis = “Flere tegn”

Ellipser bruges også til at forkorte ord, når teksten bliver for lang. Dette kaldes trunkering. Dette ser du ofte, når du arbejder med lange filnavne.

I de tidlige dage blev lange filnavne afkortet i slutningen. I dag forkortes mange apps og operativsystemer i midten, så du stadig kan se de sidste par tegn. Dette er smart, fordi de sidste par tegn ofte er de vigtigste tegn i et filnavn.

Hvis vi ikke havde trunkering, ville vi have overlappende tekst overalt. Heldigvis er ellipsen kommet til vores redning og reddet vores interface fra total kaos.

Her er hvad vi måske ser, hvis vi ikke havde ellipser. Åh, rædsel!

Lille, men mægtig

Nu hvor du har set de mange forskellige måder ellipser er blevet brugt i interface design, er du enig i, at ellipsen er den mest fantastiske karakter nogensinde? Hvem vidste, at et par små prikker kunne betyde så meget?

Jeg har ikke engang gået på alle de vidunderlige måder, ellipser kan bruges i chats og dialogtekst. Det er en historie til en anden dag ...

Næste gang du lægger en ellipsis i din grænseflade, skal du give den lidt kærlighed til mig. Det er måske bare den mest undervurderede karakter i din historie.