Design med ægte indhold til en bedre UX

Forfatter: Louise Ward
Oprettelsesdato: 8 Februar 2021
Opdateringsdato: 16 Kan 2024
Anonim
Avi Rubin: All your devices can be hacked
Video.: Avi Rubin: All your devices can be hacked

Indhold

Før vi dykker ned i fordelene ved brugeroplevelsen, skal vi afklare vores vilkår lidt.

For det første, mens du ofte hører folk diskutere dette koncept som "design med ægte data”Jeg foretrækker at bruge indhold, da det bedre fanger, hvad en designer arbejder med. Når alt kommer til alt ville du normalt ikke henvise til et billede som "data", ville du? Hvis det hjælper, kan du tænke på indholdet som "data i kontekst."

Hvad er "rigtigt" indhold

Et eller andet sted langs udviklingen af ​​design fik nogen ideen om, at du faktisk ikke gør det brug for ægte tekst for at skabe et design. At du bare kan smide noget vilkårligt latin ind, indtil de "rigtige" ting er klar. Derfor, Lorem ipsum og dens mange, mange mere eller mindre hipster offshoots.

Men for nylig er folk begyndt at indse, hvor fuldstændig gal det er. Jo da, nogle indholdsformer kan bare slippes ned i ethvert gammelt design og kaldes "godt".

Men normalt er det ikke tilfældet. Selv din "standard" blog indeholder ofte en række forskellige indholdstyper, herunder lister, interviews, casestudier, gennemgange osv. Hver af dem kunne sikkert drage fordel af en unik præsentation designet til at fremhæve indholdstypens unikke egenskaber.


Indtast design med ægte indhold. Det er et udløb af indholds-første design, der beder designere om ikke kun at starte med indhold, men at starte med ægte indhold, som rigtige mennesker i den rodede, virkelige verden faktisk laver og deler.
Bemærk, at "rigtigt" indhold kan bestå af:

  1. Faktiske fotos og statusopdateringer fra almindelige mennesker
  2. Kundeproduceret indhold til freelance-websteder
  3. Poleret kopi produceret af professionelle tekstforfattere

Okay, så hvad er det første design til indholdet?

Content-first design prioriterer oprettelsen af ​​et websteds indhold - eller en gennemgang og analyse af eksisterende indhold - Før design begynder.

Det betyder ikke, at indhold ikke kan gentages og finjusteres på en smidig måde, når designprocessen er begyndt. (Faktisk burde det absolut være at sikre, at kopi og design taler med samme stemme.) Det betyder bare at vide, hvad du arbejder med, før du begynder at arbejde med det.


Med vores vilkår på plads, lad os få fordelene ved at designe med ægte indhold.

Indholdet fremhæver "edge cases" - dvs. den virkelige verden

Designere elsker ideelt indhold. Og du kan ikke bebrejde dem: forskønne indhold er en lille del af det, de gør. Men i den virkelige verden er det kun få, der gør temmelig indhold.

I stedet slutter de sig til det nye hotte websted, udfylder halvdelen af ​​deres profilfelter, uploader et billede af to og kalder det en dag. Eller de skriver "rigtig lange overskrifter" og uploader billeder i lav opløsning til deres blogs.

Det er det virkelige liv.

Når du forstår det, gør du det ikke hold op ved at designe "ideelle" brugerprofiler, der indeholder:

  1. Kort, angelsaksisk for- og efternavn
  2. Hundredvis af smukke fotos, der regelmæssigt leveres
  3. Korte passager af tekstindhold
  4. Et livligt udvalg af "opdateringer", der dækker alle indholdstyper

Du gør en af ​​dem, helt sikkert.

Men dine andre mocks fremhæver den virkelige verden. En verden fuld af:

  1. Lange navne
  2. Navne, der skal vises på mere end et sprog
  3. Navne, der løber fra højre mod venstre, ikke fra venstre mod højre
  4. Sparsomme, dårligt oplyste, akavet beskårne fotos
  5. Dumme avatarer i stedet for headshots
  6. "Aktier", der egentlig bare er nøgne links uden kommentarer, der genererer tomme eksempler

Dette er ikke "edge cases". De er snapshots fra den virkelige, rodede, uordnede verden. Jo bedre du forstår det, jo bedre forstår du dine brugere - og hvordan man designer til dem.


Og for ikke at ovenstående eksempel vildlede dig, fordelene ved at designe med ægte indhold stopper ikke ved sociale netværk. De gælder for ethvert websted, der bruger indhold genereret af mennesker, der ikke er dig. Det vil sige alle sammen.

Forestil dig trods alt at spotte en blog, hvor hver overskrift er nøjagtigt tre ord lang. Gør du det endda tale til blogredaktøren, bro ?!

Ved at starte med ægte indhold placeres du i brugerens sko fra start

De fleste besøgende på websitet kommer ikke efter det smukke design, de "dejlige" interaktioner eller den sjove kopi.

De kommer efter de oplysninger, de har brug for, for at få ting gjort.

Ved at tage en indholds-første tilgang til dit design og derefter gå et skridt videre for at bruge ægte indhold, prioriterer du et forsøg på at forstå begge dele:

  1. Hvad du skal arbejde med
  2. Hvad slutbrugeren leder efter

Og det hjælper dig med at sikre, at de rigtige oplysninger fremhæves på de rigtige steder i det endelige design.

På en måde når du prioriterer produktion eller analyse af indhold Før design, tager du den samme vej, som din bruger vil: vade gennem et hav af information på jagt efter, hvad du har brug for. Ved at gå igennem denne proces får du en bedre forståelse af, hvad der er tilgængeligt, hvad dine kunder ønsker, og hvordan du organiserer dit indhold, så de bedre kan forstå, hvad du (eller din klient) tilbyder.

3 værktøjer, der hjælper dig med at arbejde med ægte indhold

Det er klart, at du kan trække ægte indhold ind i ethvert designværktøj for at bringe mere troskab til dit web- og produktdesign. Men der er et par værktøjer, der virkelig skinner, når du arbejder med ægte indhold.

Webflow CMS

Webflow's visuelle CMS, der blev lanceret sent i 2015, fungerer smukt med en content-first-workflow. Opret bare en samling fra 13 grundlæggende byggesten (lige fra billeder til links til referencer til andre samlinger) for at oprette en helt brugerdefineret struktur, indtast dit indhold, og begynd derefter at arbejde med det indhold for at opbygge det perfekte design. Du kan endda trække eksempler på "dummy" -data for at starte din designproces.

Craft Data-plugin til Sketch

Dette gratis Sketch og Photoshop-plugin fra InVision LABS giver dig mulighed for at hente ægte indhold fra dine egne filer, eksisterende websteder eller JSON-filer og tilslutte det direkte til dine designs.

Tilfældig brugergenerator-API

Hvis du er en kode-slinger eller Photoshopper, giver Random User Generator dig mulighed for at generere JSON-, SQL-, CSV- eller YAML-objekter, som du kan placere lige ind i dine designs.

Vælg Administration
Genial pixelillustration oprettet ved hjælp af Pantone-moduler
Læs Mere

Genial pixelillustration oprettet ved hjælp af Pantone-moduler

Pixel kun t er en type digital kun t, hvor kun tnere angiver placeringen af ​​individuelle pixel , der er bygget op til at kabe indviklede cener, pilbaggrund, tegn og 3D-effekter - alt ammen med en be...
Anmeldelse: Beyond Art Fundamentals
Læs Mere

Anmeldelse: Beyond Art Fundamentals

Det mangler tekni ke detaljer, men Beyond Art Fundamental er en god guide til at bringe følel er ind i dit arbejde. Fuld af in pirerende billeder Ma er af råd og ind igt Ikke pecielt tekni k...
Gratis web UI design e-bog
Læs Mere

Gratis web UI design e-bog

Den nye e-bog Web UI De ign for the Human Eye: Principle of Vi ual Con i tency forklarer ind og ud af vi uel kon i ten : hvorfor det er vigtigt, hvordan man vedligeholder det, og når det bryde , ...