Interaktiv design

WebdesignerDepot Redesignet!

Og her er det ... Efter alt for mange forsinkelser, utallige mock ups og ideer, den nye {$lang_domain} er endelig her! Dette var en utrolig kompleks redesignproces for hele WDD-holdet, men vi er yderst stolte af resultaterne, og vi håber, at du elsker det så meget som vi gør.

Vi lancerede det nye design i går, og Twittersphere har givet os god feedback og hjælper med at identificere nogle fejl. Vi har løst bugs for den sidste dag og gør det stadig, så vær venlig at undskylde nogle tekniske fejl, som du måske stadig kommer over i løbet af de kommende dage.

Det var vigtigt for os, at det nye design holder det gamle steds sjæl så at sige, samtidig med at vi inspirerer vores besøgende og opdaterer det til de nuværende webdesign standarder og teknikker.

Den nye hjemmeside gør især et bedre arbejde med at introducere nye besøgende på vores hjemmeside. Du vil bemærke, at navigations- og informationsstrukturen er meget renere og klarere nu.

I dette indlæg vil vi gå ind i nogle flere detaljer om, hvad der er nyt og hvad der foregik bag kulisserne for at bringe dig denne nye version af WDD. Så lad os dykke lige ind!

Hvis du har været en af ​​vores 40 millioner besøgende (!) I løbet af de sidste par år, vil du bemærke, at designet er godt, hvordan man siger det? Radikalt anderledes! Faktisk er ingen af ​​det gamle design blevet holdt. Vi smed det hele væk og begyndte at friske fra jorden op. Dette er så radikalt, som du kan få med et redesign, og det bærer visse risici for os, da vi mister vores tidligere branding fordele til fordel for det, vi mener er et bedre valg for vores hjemmeside, dets indhold og vigtigst af alt: DIG, vores fantastiske læsere !

Lad os starte med nogle kreditter for at se hvem der står bag alt dette ...

Så her er hvad der er nyt i dette design:

Hybrid layout: Magazine & traditionel blog stil

Mens det gamle design havde et traditionelt bloglayout, hvor de seneste indlæg altid vises øverst, er den nydesignede version en hybrid mellem en magasinstil og et traditionelt bloglayout. Vi finder ud af, at dette virker ret godt for vores indhold. Det bredere layout gjorde det muligt for os at bringe meget mere indhold ind på hjemmesiden, mens de 2 kolonner på hjemmesiden gør det nemmere at læse end nogle traditionelle magazineblogger, hvor indholdet til tider kan være overvældende.

Udvalgte indhold

Blogindlæggene er interspersed af tre fremhævede områder: 2 vertikale og 1 vandrette. De vertikale områder har nogle af de hotteste emner lige nu på webstedet (responsivt design, jQuery osv.), Mens det vandrette område bruges til at fremvise de nyeste tilbud fra vores hjemmeside MightyDeals.com. Alt i alt kan vi tilbyde 10 flere stillinger, end vi plejede i det foregående design uden at overvinde vores læsere.

Balance og vægt

Hjemmeside: På grund af det tunge billede forsøgte vi at holde en ligevægt mellem tekst og billeder ved at vise tilstrækkeligt preview tekstindhold til hvert indlæg. For de faktiske artikelsider valgte vi at have billeder og kodestykker i fuld bredde, mens teksten vises med en smalere bredde til billederne. Dette gør webstedet hurtigere og lettere at læse (eller scanne) og viser billederne i deres størst mulige størrelser for maksimal effekt. For billederne i ældre indlæg og andre snævrere billeder valgte vi at vise grå søjler på siden, der minder om de sorte søjler, du ser, når du ser et standarddefinitionsprogram på et HD-tv. Dette var det bedste kompromis vi kunne finde for at integrere de ældre indlæg i webstedets nye udseende uden at eftermontere hundredvis af indlæg!

Responsivt design

Det nye websted er nu fuldt lydhørt og ser godt ud, om du er på en stationær computer, laptop, tablet eller smartphone. Tjek den smarte telefonversion, som den ser ud og føles mere som en app end en hjemmeside, og vi er virkelig stolte over den måde, denne viste sig. Det laster også hurtigt!

Nethinden grafik

Med Apple udrulning af flere nethindenheder bliver skærme med højere opløsning mere relevant for websites. Den nye WDD serverer nethinden grafisk, hvor det er muligt. Webstedets design ser perfekt skarpt ud på nethinden. Fremadrettet vil vi have netop optimeret grafik i alle vores stillinger, hvor det er muligt. Dette er lettere sagt end gjort, da internettet ikke er helt retina klar endnu, i virkeligheden er der meget få websteder, der serverer stor high-res grafik på dette tidspunkt. Nogle af vores seneste indlæg er allerede delvis retina klar, og nogle vil bære dette i fremtiden. Vi har også hørt, at nethindeannoncer måske ikke er for langt i fremtiden.

Forbedret navigation

Du vil se et plustegn på højre side af dine browsere (ikke på mobile enheder), når du ser artikler. Når der klikkes på, åbnes det en mini-browser, der giver dig mulighed for at navigere gennem den aktuelle artikel, som at gennemse indholdsfortegnelsen i en eBook. Du kan også dele den aktuelle artikel via mini-browseren eller se relaterede artikler samt læsning af de næste og forrige indlæg.

Kunsten

Endnu engang samarbejdede vi med über talentfulde illustrator Radim Malinic for at skabe kunsten til vores nye site. Radim er en prisvindende kunstdirektør og grafisk designer, der er baseret i London, England. Under navnet af Brand Nu han arbejder med førende husstands mærker. Siden den oprindelige WDD website design har han gået videre med at arbejde med Goldman Sachs, Bacardi, Blistex, London Film Museum og mange flere. Hans arbejdsstil er en af ​​de mest forskelligartede i branchen. Hans dristige og farverige design inspirerer mange mennesker, der ser dem. Vi bad Radim om at fokusere sit design på cirkler denne gang, da dette er en tidløs form, der er ekstremt populær og begunstiget i aktuelle website designs.

Parallax

Den nye kunst og logo på overskriften bringes til liv med en 5-lags parallax-effekt (flytter med forskellige priser) i overskriftsdelen af ​​hjemmesiden. For at se det, skal du bare flytte musen rundt i overskriftsområdet (ikke på mobile enheder). Vi synes det ser ret cool ud og tilføjer et element af sjov til webstedet! [UPDATE] Parallax effekten var elsket af de fleste, men nogle mennesker kunne ikke lide det, så vi tilføjede muligheden for at slukke det ved at højreklikke på effektområdet.

Logo

Selvom det gamle logo gav os godt og var godt lide, da dette var et komplet redesign, var et nyt logo i orden! Vi samarbejdede denne gang med Steven Bonner at redesign vores logo. Han er en meget talentfuld typograf med base i Skotland med en misundelsesværdig portefølje af typegodsede illustrationer til nogle af verdens største mærker. Vi synes det viste sig godt og balancerer stedet godt med et personligt håndtrykt tryk, mens du ser professionelt og poleret på samme tid.

Typografi

Vi drog endelig det gamle kedelige system skrifttyper til fordel for Typekit web skrifttyper, der udelukkende anvendes på hele webstedet. Vi bruger Kulturista til alle hovedet, der ser godt ud og har en dejlig personlighed og en unik følelse. Til den tekst, vi valgte Proxima Nova som har enestående læsbarhed og er perfekt til store tekststykker. Til overskrifter overvejede vi også Adelle , og for body tekst vi også betragtet Museo Sans, Adelle Sans , Myriad og Helvetica .

Pictos ikon skrifttype

Vi bruger mange ikoner i dette nye design. Ikonerne er en del af den fantastiske Pictos ikon skrifttype designet af Drew Wilson . Vi bruger det endda til vores animerede sociale ikoner nederst på siden.

Sidefod

Vi har 2 footer områder nederst på siden. Den første fremhæver nogle områder, som vi mener er vigtige at understrege, og så har du en mere traditionel kiggerfod nederst med for det meste tekstforbindelser og nogle animerede sociale ikoner.

Social integration

Vi ønskede at fremvise vores læsere på en større måde, så den nye WDD er langt mere social end før. Vi har nu dine kommentarer og retweets lige under hvert indlæg på hjemmesiden. Så hvis du vil have en smule berømmelse, kan du nu få din avatar lige der for hele verden at se! Nå, det er lidt overdrevet!

Færre annoncer

Okay, nogle gode og nogle dårlige nyheder. Nogle af vores annoncer blev større, men vi har også reduceret antallet af annoncer, der kører på webstedet. Vi indrømmer, at vores site i årenes løb blev for opblæst med annoncer, så det var en fantastisk mulighed for at rydde op. Dette har gjort layoutet renere og mere æstetisk glædeligt at navigere, samtidig med at man stadig er i stand til at kunne betale lejen - glem ikke at støtte vores gode sponsorer :)

Depot.ly

Dette er faktisk et par uger gammelt: Vi begyndte at bruge depot.ly kort URL til vores tweets, så du kan genkende vores indlæg i alle sociale kanaler, du bruger. Ganske nyttigt, vi tror!

Mere indhold

Som du måske har bemærket, begyndte vi for nylig at sende flere artikler hver dag. Selvom redaktionelle stillinger har været og fortsat er essensen af ​​vores indhold, dækker vi nu også relevante nyheder og mini-indlæg, der passer til designerne og udviklerne på vores websted. Vi mener, at dette holder webstedet mere aktuelt og i kontakt med hvad der sker i verden lige nu uden at ty til fuld redaktionel for hver post.

Vi oplevede masser af problemer at få dette design til at fungere på tværs af alle browsere og enheder (og stadig gør!). Faktisk var dette årsagen til nogle af de sidste minutforsinkelser, vi oplevede. Vi var nødt til at lancere i sidste uge, men mange browser problemer slog os ned. Ked af det! Firefox var særlig udfordrende, men IE 8 viste sig at være værre og årsagen til mange hovedpine og frustrationer for vores coders. Siden lanceringen i går har vi modtaget en masse ekstra info via Twitter om problemer, der stadig skal løses. Tak for din tålmodighed, mens vi adresserer disse.

Hvad du ser i dag er det nye design, men det er ikke alt. Vi planlægger snart at tilføje nogle nye ting. Du vil lære mere om det i de kommende uger.

Vi elsker alle det nye design personligt, og vi forventer, at det fortsætter med at udvikle sig på baggrund af din feedback. Vi vil virkelig sætte pris på det, hvis du stadig kunne fortælle os om noget, som du gerne vil have os til at forbedre. Lad os også vide, om du tilfældigvis finder problemer med browserkompatibilitet eller problemer med bestemte mobile enheder, som du bruger, så vi hurtigt kan adressere dem.

Som altid er vi dybt og uhyre taknemmelige for jer alle for at støtte WDD i alle disse år. Fra hele teamet her på WDD, en stor tak til hver af jer, og vi håber, at dette nye design inspirerer dig og tjener dig godt, mens du besøger vores hjemmeside.

Hvad synes du om det nye WDD redesign? Vi byder dig velkommen til din tilbagemelding!

lydhør design webdesign redesign WDD nethinden grafik webdesignerdepot