Portfolio Mathias Andelin www.webbformgivare.se [email protected] 1 Innehåll Redesign. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3 Värvet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3 Addflow . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5 Pingdom Tools . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7 Radioparadise.com . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10 Atomia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13 Intranät. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16 Västerås Stad . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16 Seco Tools . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18 Responsiv design. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Riksutställningar. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Checkinsweden.com. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Hairnordic.com. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20 Fishbone framework 2013 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20 Webbplatser. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21 Skolporten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21 Kampanjwebbar. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21 Business på riktigt. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21 Wireframes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22 Designmanualer. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22 Trycksaker. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23 Corporate identities . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24 Banners/Webbannonser. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26 2 3 Visual ID & webb Värvet.se Redesign / Redux ρρ Responsiv webbformgivning av webbplats ρρ Photoshop & Sketch Redesign av Skandinaviens största intervjupodcast av och med Kristoffer Triumf. Fokus i redesignen har varit att göra upplevelsen mer användarvänlig och enhetlig. Lyssnare och besökare ges möjlighet till att föra en konversation med hjälp av ett lättillgängligt interface för kommentarer (sociala funktioner skapar känslan av tillhörighet bland besökarna vilket ökar chansen till återbesök). För att skala av informationsmängden har en meny skapats för låtlista, reklaminslag och 4 4 5 Visual ID & webb Addflow Logotyp & webbplats ρρ Webbformgivning av webbplats Photoshop & Sketch ρρ Grafisk formgivning av logotyp/visitkort Illustrator & Indesign Grafisk formgivning av logotyp, visitkort och webbformgivning av extern webbplats åt startupföretaget Addflow AB. Företaget erbjuder tjänster och produkter för digitala redaktionella system. 6 6 Gamification7 Gamification 8 Gamification Pingdom Tools Redesign av optimeringstjänst ρρ Responsiv webbformgivning av webbplats Sketch & Photoshop ρρ Idé: Gamification och tjänsteförmedling för ökat engagemang & återbesök Veckans optimerare. För att öka engagemanget och locka till återbesök var min idé att tillföra sk “gamification” i form av möjligheten för användarna att bli “veckans optimerare” och vinna priser. Branschnav. Genom att erbjuda yta för utvecklare och företag att annonsera sina tjänster inom webbplatsoptimering utvidgar vi kopplingen och relationen till branschens aktörer vilket skapar ett mervärde kring tjänsten. Pingdom.com är i huvudsak ett övervakningssystem för webbsidor och webbservrar. 500 000 kunder i mer än 200 länder, med användare som Spotify, Microsoft, Instagram, Twitter, Dropbox, Disney, Mailchimp och Aftonbladet. 9 9 Streamingtjänst 10 Streamingtjänst 11 Streamingtjänst Radioparadise.com Redesign av streamingtjänst ρ Webbformgivning av webbplats Photoshop & Sketch Primär call to action. Bättre och tydligare placering av playknappen. Personligt. Fokus på en mer personlig navigering till sparade favoriter, länk till lista med låt-trådar som användaren skrivit kommentarer i och till egna inställningar. Sociala kommentarer för årterkommande besök. Jag har lyft fram de sociala kommentarerna till startsidan (tidigare på en undersida) för att skapa mer återbesök till sidan (diskussioner mellan användare skapar ett socialt sammanhang och får besökare att vilja återvända oftare). 12 Säljexponering. Mer säljfokus. Förslag på konserter (affiliatelänkar till sajter som Ticnet) som baseras på användarens favoriter, geotaggar och profilinställningar samt exponering av den aktuella artistens album med affiliatelänkar till sajter som 12 amazon.com Redesign Addflow Logotyp & webbplats ρρ Webbformgivning av webbplats ρρ Grafisk formgivning av logotyp/visitkort Grafisk formgivning av logotyp, visitkort och webbformgivning av extern webbplats åt startupföretaget Addflow AB. Företaget erbjuder tjänster och produkter för digitala redaktionella system. 13 14 Redesign Atomia Redesign av webbplats ρρ Webbformgivning av webbplats Sketch & Photoshop Atomia är ett ungt, snabbt växande företag i centrala Västerås. De utvecklar, marknadsför och säljer en molnplattform till webbhotell och teleoperatörer i hela Europa. 15 15 Intranät Västerås Stad Grafisk design av intranät ρ ρ Grafisk formgivning. Photoshopskisser Grafisk manual med mått och färgangivelser Primär målgrupp är 11 000 medarbetare inom Västerås Stad. 16 Intranät Seco Tools Grafisk design av intranät ρ ρ ρ Interaktionsdesign. Wireframes Grafisk formgivning. Photoshopskisser Grafisk manual med mått och färgangivelser Primär målgrupp är 5300 medarbetare inom Seco Tools. En stor utmaningen var att lyckas få till en bra och modern design trots begräsningar i ett mycket gammalt CMS(Lotus Notes WebKit). 18 17 Responsiv design Riksutställningar Checkinsweden.com Responsiv design Koncept & design, webbutveckling av hotellportal i responsiv design ρ Wireframes ρ Photoshop- och Fireworkskisser ρ Wireframes & Photoshop ρ HTML5 & CSS3 /Twitter Bootstrap ρ HTML5 & CSS3 / Wordpressimplementation Då allt fler användare surfar med smartphones och surfplattor var Riksutställningar i stort behov av att uppgradera sin webbplats med responsiv design (dvs sidans design och layout anpassas efter besökarens enhet och skärmstorlek för bättre användbarhet). Mathias tog fram designskisser/layouter, HTML5/CSS3 som beskriver hela processen inklusive visuella riktlinjer som mått, typsnitt och färgspecifikationer. CheckinSweden.com är en guide till Sveriges hotell och konferensanläggningar i Sverige. Sajten innehåller förutom hotell- och konferenssök även en evenemangsdel, nyhetsblogg och väder. Webbplatsen tar hänsyn och anpassar sig layoutmässigt till alla plattformar som desktopdatorer, läsplattor och smartphones. Mathias höll i allt från planering, design, webbutveckling till lansering www.riksutstallningar.se www.checkinsweden.com 18 Webbplatser & kampanjplatser Skolporten Business på riktigt Koncept & design av webbplats Grafisk design av kampanjwebb ρ ρ Koncept & design Grafisk manual Primär målgrupp är lärare, specialpedagoger och chefer inom skolväsendet. Sajten tillhandahåller skolnyheter och nyheter inom specialpedagogik bland annat. Målet med webbplatsen är att underlätta vardagen och svara mot de önskemål & behov man har i sin profession oavsett man är pedagog, rektor eller skolchef. www.skolporten.se ρ ρ Grafisk formgivning. Photoshopskisser Grafisk manual med mått och färgangivelser De gröna näringarna är en framtidsbransch med många möjligheter för kreativa och affärsinriktade människor. Därför arrangerade LRF Ungdomen det vassa företagseventet “Business på riktigt”. www.businesspariktigt.se 19 Corporate identities 25 20 Banners/Webbannonser Animerade flashbanners till kunder som ABB, Tidningen Market, Boken Why We Buy, Byrånumret, Executive People, Bytbil, mfl... 26 21 Portfolio Mathias Andelin www.webbformgivare.se [email protected] 22
© Copyright 2024