Nettdesignkritikk # 29: MadeFreshly
Hver uke tar vi en titt på en ny webside og analyserer designet. Vi vil påpeke begge områdene som er gjort godt i tillegg til de som kan bruke litt arbeid. Til slutt avslutter vi med å be deg om å gi dine egne tilbakemeldinger.
Dagens nettsted er MadeFreshly.
Hvis du ønsker å sende inn nettstedet ditt for å bli vist i en fremtidig designkritikk, tar det bare noen få minutter. Vi belaster $ 24 for kritikk av designen din - betydelig mindre enn du betaler for en konsulent for å se på nettstedet ditt! Du kan finne ut mer her.
Om MadeFreshly
“En handlekurv med smak. Trender endres, og det samme bør nettbutikken din. MadeFreshly tilbyr deg et friskt design for handlekurven. "
Her er et skjermbilde av hjemmesiden:
Førsteinntrykk
Rett utenfor flaggermusen kan jeg si at jeg virkelig liker designet til MadeFreshly. Det er flere kule designideer og quirks her som vi skal snakke om nedenfor. Jeg har definitivt noen få forbedringsforslag, men for det meste er det et flott nettsted som er opprettet av veldig talentfulle designere.
Min største kvalme er sannsynligvis fra et konseptuelt synspunkt. Dette er definitivt en subjektiv kritikk, så føl deg fri til å ignorere den fullstendig, men jeg synes det er underlig at nettstedets visuelle motsier metaforen som er satt på plass med nettstedets navn. "MadeFreshly" kan innebære en rekke ting: Mat generelt, bakevarer som er varme ut av ovnen (det er her tankene mine går), noe naturinspirert eller til og med noe nytt og skinnende.
Imidlertid har designeren valgt et lite grunge utseende for nettstedet. Bakgrunnen er en gammel tekstur, og overskriftene har også brukt litt grunge på dem. Igjen, dette gir en flott side, men det er i strid med konseptet "Fresh."
Innhold skal alltid gå foran og bestemme design. Å utforme rundt, eller i det minste ikke i motsetning til, navnet og den forhåndsetablerte metaforen for et nettsted, hjelper alt til å binde seg sammen og bare føles "riktig."
Som et eksempel, sjekk ut en veldig lignende situasjon på nettstedet "Formee", som leverer "nybakte former." Det visuelle er en vennlig kokkekarakter som forsterker tagline.
Ikke kopier denne ideen, men du kan vurdere hvordan du også kan knytte begrepet "frisk" til det visuelle på siden.
Logoen
Jeg synes MadeFreshly-logoen er flott. Skrifttypen er ganske attraktiv mens den fremdeles føles unik og den pene krøllete klistremerkeeffekten gir en følelse av dybde til nettstedet. Flott arbeid!
Toppteksten
Overskriften er fin og enkel med enkel tekstnavigering og en lett merkbar påloggingsfane. Kom innom og se på full størrelse i dette området, så ser du at det bare er mye plass som flyter over logoen.
Jeg har ikke noe imot mellomrom og til og med oppfordrer designere til å bruke det ganske liberalt, men et stort tomt område er en veldig vanskelig måte å starte siden på. Løsningen her er død enkel, bare reduser den plassen med omtrent halvparten, og den skal se bra ut. Du vil fortsatt beholde god plass, bare ikke så mye at det er distraherende.
Et annet problem jeg ser her er at logoen er i en merkelig horisontal stilling. Innholdet på høyre side av siden stiller sammen på høyre side, og antyder ikke et sentrert, men en rettferdig layout. Logoen stemmer imidlertid ikke med innholdet til venstre, og er heller ikke sentrert over elementet under den (en annen forsvarlig posisjon). I stedet flyter det vanskelig til høyre for å være venstrejustert og til venstre for å være midtjustert.
Den enkle løsningen her er å scoote logoen til venstre slik at den stemmer overens med innholdet under den. Den er nesten der allerede og trenger bare en god skyfri.
Den kjente delen
Seksjonen under overskriften, som jeg vilkårlig omtaler som "den kjente delen", er den delen av siden som virkelig fanger oppmerksomheten din. Den har mer visuell vekt enn innholdet rundt det, så det føles viktigere og øynene dine blir nesten umiddelbart trukket til det (alle gode ting).
Knappen “opprett butikk nå” er fin og lys og fungerer som en sterk handlingsfremmelse. Etter at du har sett knappen, hvis du har et nytt blikk rundt deg, blir øynene trukket tilbake til den av pilen, en fin touch som gir enda mer oppmerksomhet til et av de viktigste elementene på hele siden. Du kan vurdere å legge en sveveeffekt på knappen like litt som en UX-boost, men ellers er det et solid design.
Min ene kvartal her er overskriftsteksten. På den ene siden er den attraktiv og gir litt fin repetisjon til teksten som brukes i logoen. På den annen side er det rett og slett ikke en rask lesing bare på grunn av kompleksiteten i skrifttypen.
Dette er en av de situasjonene der estetikk og lesbarhet er i odds. Hvis du endret skrifttype her, tror jeg bestemt at nettstedet vil være mindre attraktivt for det, men du kan fordoble antall brukere som faktisk leser overskriften.
Du kan vurdere å eksperimentere med å legge igjen ett ord i overskriften i manuset og konvertere resten til noe litt mer leselig. Så for eksempel kan "en handlekurv med" være mindre og i en vanlig sans-serif-font, mens "smak" kan fremheves både gjennom større størrelse og bruk av skrifttypen.
Til syvende og sist er det akseptabelt hvordan det er, og dette er bare forslag du bør vurdere. Det ville være flott å kjøre noen AB-tester på dette elementet for å se om det å gjøre det mer lesbart har noen målbar effekt på konverteringer. Hvis ikke, så hold definitivt skriptet.
Tre opp seksjon
Bunnen av siden viser tre skjermbilder med ordene friske, enkle og effektive. Dette er fengende og minneverdig, og delen ser fantastisk ut. Jeg elsker at bakgrunnsstrukturen slutter og miniatyrbildene overlapper hverandre i det nye området. Igjen legger designeren litt mer dybde til designen sin for å få den til å føles så mye mer ekte og mangfoldig.
Alle dristige avsnitt
Normalt holder vi oss til hjemmesiden for Design Critiques, men denne gangen pirket jeg litt rundt på de andre sidene. En ting som jeg synes er verdt å påpeke er avsnittteksten på "Tour" -siden.
Avgjørelsen om å gjøre avsnittene alle dristige fungerer ikke. Brevene ser ut som om de er stappet mot hverandre og er ganske vanskelige å lese. Ved å uthevet kroppskopien reduserer du dessuten effekten av en fet tittel (kontrast er nøkkelen) Jeg vil anbefale å gi denne teksten samme styling som den ikke-dristige teksten under de tre miniatyrene på hjemmesiden.
Din tur!
Nå som du har lest kommentarene mine, kan du slå inn og hjelpe ved å gi designeren noen flere råd. Gi oss beskjed om hva du synes er flott med designet og hva du synes kan være sterkere. Som alltid ber vi deg også respektere nettstedets designer og tilby klare konstruktive råd ugyldige for harde fornærmelser.
