Interaktiv design

En titt på den nya MSN.Com Design

Sedan den 9 mars i år har Microsoft rullat ut sin nya design av MSN.com.

Backas av otaliga testtimmar och ungefär 70 000 bitar av feedback från sina användare, har designen blivit tweaked under de senaste fyra månaderna till dess nuvarande tillstånd.

Besökare som ännu inte kan visa den på http://www.msn.com kan komma åt det på http://preview.msn.com .

I det här inlägget tar vi en titt på den nya omkonstruktionen och undersöker dess positiva och negativa aspekter.

Gärna dela din åsikt om designen i kommentarfältet.

Under de senaste tio åren har tre huvudsidor skapat en solid grundning som webbplatser som människor vänder sig till när de börjar sina onlineupplevelser.

Medan Yahoo och MSN fokuserade på att lägga till funktionella element på deras sidor, stannade Google med en minimal design och istället lade de sina nya applikationer på olika webbadresser med endast subtila anmärkningar på deras huvudsida. Google kom framåt, men Yahoo och MSN har inte givit upp och de har fortfarande en stor del av marknaden.

Ett av de främsta målen med den nya designen är att uppdatera gränssnittet med ett mycket renare utseende. en look som påminner om Google. För att uppnå detta har de ändrat bakgrunden till en konsekvent vit och de har lagt till flikar för olika innehållsavsnitt. De har också fått större synvikt i huvudnyheterna genom att ge den en större rubrik och göra bilderna större. Detta ger användaren en tydlig indikation på var ögonen ska dras omedelbart, vilket gör att webbplatsen känns mindre upptagen.

Den vita bakgrunden gör webbplatsen ren, men det gör det på bekostnad av att förlora det blåa vilket gjorde den gamla webbplatsen lätt igenkännlig och unik. Trots återkopplingen som MSN har mottagit som säger att den vita bakgrunden känns renare, kan det vara fördelaktigt för Microsoft att omfamna sin gamla blå bakgrundsfärg. Genom att gå med en enda bakgrundsfärg togs många vertikala linjer bort. Detta gör att webbplatsen känns bredare trots att den faktiskt blir något tunnare med cirka 20 pixlar.

Flikarna gör att sidan ser ut så mycket renare. Sektionerna på sidan verkar inte vara uppdelade på ett uppenbart sätt, men det är inte nödvändigtvis skadligt. MSN inser att denna sida inte kommer att användas som en tidning eller till och med som en nyhetswebbplats.

Varje avsnitt ger små rubriker och korta meningar som syftar till att locka läsaren att klicka igenom och lära sig mer. När man talade om den nya designen förklarade Scott Moore (MSN: s generaldirektör för innehåll och programmering) att webbplatsen använder maskininlärning för att dela användarna i åtta grupper.

Han gick inte över detaljerna, men det kan innebära att placeringen av sektionerna / flikarna kommer att bestämmas av de saker som användarna har visat intresse för.

Innehållstillägg

En funktion som MSN-laget bestämde sig för att fokusera på är socialt nätverkande. Användare kan nu logga in antingen på deras Windows Live / Facebook / Twitter konto för att få live uppdateringar som visas på deras MSN hemsida.

Det här är en funktion som vissa människor kommer att hitta lite praktiska och andra kommer att ignorera helt. "Social Media" har varit ett Internet-buzzord i mer än ett år nu och det är förvånande att MSN har tagit så lång tid att integrera den i sin hemsida.

Sociala tillägget påverkar inte många människor på att använda sin hemsida, men det påverkar inte deras utseende negativt och det visar att de omfamnar Internet istället för att tvinga sina användare att bara använda MSN-applikationer.

MSN-hemsidan har utformat Bing-sökfältet mycket mer framträdande. Den har fått sin egen sektion istället för att bli tvungen att dela sitt utrymme med många olika element.

Den här ökningen av uppmärksamhet för Bing har gett sin sökmotor en dubbelsiffrig ökning av sökningar. Den större sökfältet Bing kan vara en av de bästa funktionerna i MSN-redesignen, eftersom det visar att MSN nu har en bättre förståelse för att hemsidor vanligtvis används som utgångspunkt för en webbsökning. Människor kommer snabbt att ändra sin hemsida om de tycker att MSN tar för lång tid för att ladda irrelevant innehåll.

Det tredje stora tillägget är ett fokus på lokalt innehåll. Längst upp till höger på sidan finns en länk för Local Edition. Local Edition är som en annan version av hemsidan men det är mer relevant för varje enskild person. Användaren kan spara upp till tre olika städer (eller postnummer) men det är inte särskilt intuitivt om hur man lägger till dem. Användaren måste ange ett stadsnamn, klicka på "Spara" och sedan lägga till ett annat måste de klicka på "Ändra". Det skulle vara mer meningsfullt att istället få länken att läsa "Lägg till".


Lokal utgåva

När användaren har valt en stad har de tillgång till lokala nyheter, väder, sport, filmer / evenemang, restauranger, gas / trafik och några andra saker. Alla dessa funktioner är verkligen väl implementerade utom i avsnittet Restauranger.

För restaurangerna listar vi enkelt närliggande restauranger med länkar till recensioner, 5 stjärnor och bilder. När länken Granskning eller betyg klickas laddas en sida som innehåller olika detaljer om restaurangen men det har inga kundrecensioner och rating-widgeten finns ingenstans att se. Det känns som att denna funktion togs från en statisk referensbok.

s De andra funktionerna är alla bra gjort och det är värt att prova dem. Observera att Lokalt utgåva endast är tillgängligt i USA vid denna tidpunkt.

Den sista tillägget som är värt att nämna är TrendWatch-funktionen som listar de senaste Twitter-trenderna. Denna funktion är märkligt lik Yahoo's Trending Now-sektion, men den har pilar bredvid varje sökfråga för att visa sin popularitet momentum. Det är lite klibbigt och placeringen längst ner på sidan gör att den känns mer som en eftertanke än en användbar funktion.


Yahoo Trends Nu jämfört med MSNs TrendWatch


Prestanda

Intressant är att den gamla MSN-webbplatsen hämtar all dess innehåll till användarens maskin med en sekund mindre än den nya designen. Den nya designen utför sedan mycket mer kod, vilket gör sin totala färdigställelsestid nästan 3 sekunder längre än den gamla designen.

Den lokala upplagan fungerar lite bättre än den nya designen med en färdig dokumenttid på 2.582 sekunder, men den färdiga tiden är en ful 10.545 sekunder på grund av att en inbäddad video laddas.

Eftersom allt visar ungefär samma tid, kommer användarna inte troligt att märka skillnaden i prestanda och det kan vara till nackdel för den nya designens framgång.

Hemsidor ska vara extremt snabba och detta är ett område där MSN har möjlighet att verkligen skina mot majoriteten av sina konkurrenter. Crowds av människor som proppas i kaffebutiker eller flygplatser som delar trådlösa nätverk vill ha webbplatser som laddar snabbast.

Om de har MSN som startsida kommer de snabbt att navigera till en snabbare webbplats eller de använder sökningen längst upp till höger i de flesta moderna webbläsare. Om detta inträffar tillräckligt ofta kommer användarna att frestas att ändra sin hemsida helt och hållet.

Notera: http://www.webpagetest.org användes för testning. Följande är de tre tester som utfördes:

Övergripande Design

Den övergripande omkonstruktionen är effektiv. Det tar upp några av MSN: s oro med sin gamla design och det ger en renare bild för Microsoft.

Designen ger en något bättre visuell hierarki men det finns definitivt utrymme för förbättringar. Huvudinnehållssektionen är den första som tar tag i användarens uppmärksamhet, följt av den stora Bing-sökfältet, men efter de två elementen är det svårt att fastställa vad exakt kommer att uppmärksamma nästa.

Detta beror delvis på att sidan har en stor mängd innehåll som alla har olika nivåer av betydelse för varje individ. Eftersom alla är olika är det svårt att veta exakt hur man ställer in den visuella vägen, men även en liten aning kan ge betydande resultat.

Ingen sektion har en högre synvikt än någon annan sektion.

Medan färgschemat fungerar, definierar det inte designen. Förutom den lilla gradienten längst upp på sidan och MSN-logotypen finns inget som visar MSN-identiteten. Webbplatsen kommer över som blid och utan någon personlighet. Sidan ges inte chansen att sälja sig genom att vara charmig; det kan bara lita på dess funktioner.

En av de bästa aspekterna av omkonstruktionen har varit införandet av betydande vitt utrymme. Varje nyhetsrubrik har fått ytterligare 12 pixlar av vertikalt utrymme för att skilja det från de andra rubrikerna. Teckensnittstorleken har också ökats vilket gör allt mycket lättare att läsa.

Slutsats

Den här nya designen känns som att den uppdateras för att passa in i MSN: s konkurrenter. Medan allt ser bra ut och uppträder som det borde, har inte tillräckligt gjort för att göra designen driva gränserna för vad en modern webbplats kan göra.

Webbplatsen handlade om sin identitet och rodnad för renlighet och några mediokerfunktioner. Local Edition är ett bra tillskott och det har en bra chans att fånga på, särskilt om den ges en väl marknadsförd mobilversion.

referenser


    Denna artikel har skrivits uteslutande för Web Designer Depot av Eli Penner

    Vad tycker du om MSN: s omdesign? Vad skulle du ha gjort annorlunda?


    design designa om msn