Portfolio of Andreas Hilber UX Design, Web Design, Information Architecture

Transkript

1 Portfolio of Andreas Hilber UX Design, Web Design, Information Architecture Creative Director of Bluerock Studios Ltd. (London) 2013 Creative Director of DECADE ONE GmbH & Co.KG (Munich)

2 UX Design Rohde & Schwarz Web Relaunch Rohde & Schwarz :: Beratung zum Web Relaunch 2011/2012 Routingpage Rohde & Schwarz is the world s leading manufacturer of wireless communications and and measurement equipment. For the redesign and reorganisation of their worldwide website relaunch weaknesses in the current site were located and conseqeuently enhanced to build a solid user experience with a light look but also a high density of information.

3 Design Rohde & Schwarz Web Relaunch

4 UX Design Rohde & Schwarz Mobile Styleguide 5 % Transmitter Calculation optionale Zweite 5 % 45 % 10 % 40 % 50 % 5 % Suche 55 % 100 % smartphone_popoveropenall.psd smartphone_tabbarextended.psd smartphone_buttons.psd smartphone_navilistsprssednavi.psd smartphone_sortedlist.psd A complete styleguide for all mobile applications of Rohde & Schwarz. It includes every layout, button, colour and navigation element developers and designers need to create any type of app regardless whether it is for tablets or smartphones. smartphone_sidenavigationsearch2.psd smartphone_content.psd smartphone_slider.psd

5 Information Architecture Web relaunch concept for Mini Cooper RelAuNch INFoRMAtIoNsARchIteKtuR AKtuelle INFoRMAtIoNsARchIteKtuR:.de Modelle Home Caprio Clubman John Cooper Works Modellvergleich One Cooper D Cooper Cooper S Design Individualisierung Fahrerlebnis Sicherheit Service/Wartung Finanzierung Preisliste Daten & Fakten Bilder Cooper Cabrio Cooper S Cabrio Cooper D Clubman Cooper Clubman Cooper S Clubman John Cooper Works John Cooper Works Clubman John Cooper Works CHALLENGE Exterieur Interieur Exterieur Interieur LeichtmetallrŠder Alle Ausstattungen Ausstattungspa kete Motor / Leistung Fahrwerk Lifestyle & Zubehšr Modelle Background / Philosophie News / Community Fun & Games Zubehšr Lifestyle Shop John Cooper Works Tuning Dachdesigner Service Center Caprio Clubman John Cooper Works Downloadgallerie Modellvergleich Produktion Recycling MALISM Techniklexiko Die Story n EXCITEMENT CARD Mein Urban Style Tour CHALLENGE MEET International Magazin Mini Aktuell E-Cards Cabrio Soundmix MALISM Mitfahrzentrale 3D Game bersicht Dialogservice konfigurieren Angebot anfragen Probefahrt vereinbaren Infomaterial bestellen Partner finden finanzieren Gebrauchte Automobile Gro kunden Military Sales Recycling Mein Service Home Fun & Games E-Cards Cabrio Soundmix Downloadgallerie 3D Game Service Mini Shop Specials Erleben Mini Aktuell International Magazin Driver Training Techniklexikon MEET MALISM CHALLENGE Mitfahrzentrale Die Story Produktion Urban Style Tour EXCITEMENT CARD Onitsuka Tiger fÿr THE OTHER MOVEMENT E Das neue Cabrio HŠndler finanzieren Service Sonderkunde n Zubehšr Onitsuka Tiger fÿr Lifestyle Shop John Cooper Works Tuning HŠndler Onitsuka konfigurieren Tiger fÿr E Special THE OTHER Das neue MOVEMENT Cabrio Driver Training RelAuNch INFoRMAtIoNsARchIteKtuR Legende Mehrfache Referenzierung Kategorie KAteGoRIe subseiten Modelle Konzeptionelle VerŠnderung Subkategorie KoNsIsteNte und verständliche NAvIGAtIoNsstRuKtuR KAteGoRIeNsuche Caprio John Cooper Clubman Works Modellvergleich One One One Infomaterial bestellen Design konfigurieren zu kaufen Individualisierung Dachdesigner Fahrerlebnis Sicherheit Service/ Wartung Finanzierung Preisliste Daten & Fakten Bilder Mini Entdecken Consulting Mini Cooper regarding the relaunch of their website included an analysis of the exisiting complex site structure in order to suggest a much easier and natural information architecture. Legende Kategorie Subkategorie Gruppierung One One

6 Concepts Web relaunch concept for Mini Cooper mood bilder (kein design) site design characters These concept papers are examples of several mini game ideas to involve the user interactively on the new site: Mini City lets users navigate through contents three-dimensionaly while they can see and interact with other visitors. Release Me is a playful interaction system that splits contents into new tiles to open subnavigations. Gear Stick lets users choose a special character related to the different gears on the Mini gear stick. r - spiesser 1 - standard 2 - stratege 3 - girly 4 - angeber 5 - mini-fan 6 - freak

7 Design Web relaunch concept for Mini Cooper

8 UX Design Mobile Apps for Sony Music LYRICS GAME 4 LYRICS AUSSORTIEREN LYRICS GAME 2 LYRICS ZUM SONG ERKENNEN Wähle den passenden Lyrics-Schnipsel zur aktuellen instrumentalen Soundwiedergabe! Wähle den Lyrics-Schnipsel, der NICHT zum Song Smash Into You passt! 1 Schnipsel 1 3 Schnipsel 3 2 Schnipsel 2 4 Schnipsel 4 Time 00:14 Schnipsel 1 Schnipsel 2 Schnipsel 3 Schnipsel 4 Verschiedene Schwierigkeitsgrade einstellbar, so können z.b. die Länge der Schnipsel je nach Schwierigkeitsgrade länger oder kürzer sein. 5 LYRICS GAME 7 LYRICS SORTIEREN Erstelle einen neuen Song, in dem du die Wörter beliebig ersetzt! Schwierigkeitsgrad via Länge der Schnipsel einstellbar. Wort 1 Wort 2 Wort 3 Wort 4 Wort 5 Wort 5 Wort 6 Wort 7 SAVE 7 Erstelle deinen eigenen Song und share ihn mit deinen Freunden via Twitter und Facebook. LYRICS GAME 1 LYRICS SORTIEREN LYRICS GAME 6 LYRICS SORTIEREN LYRICS GAME 1 LYRICS SORTIEREN TEAM HIGHSCORE 10 If I Were A Boy Beyoncé 1 Ordne die Lyrics-Schnipsel in die richtige Reihenfolge! Schnipsel 1 Welcher dieser instrumentalen Songs gehört NICHT zu Beyoncé s Portfolio? If I Were A Boy Beyoncé 1 Ordne die Lyric-Schnipsel in die richtige Reihenfolge! x David wins! 00:09 Schnipsel 1 WERTUNG LYRICS SORTIEREN 2 Schnipsel 2 2 Schnipsel 2 Summary 3 Schnipsel 3 3 David Andrej Nando Steve Schnipsel 3 15 p 12 p 9 p 6 p 4 Schnipsel 4 4 Schnipsel 4 next game starts in 3 s Time 00:32 OK Time 00:29 Time 00:32 OK Wertung im Multiplayer Die Schnipsel lassen sich per Drag & Drop an die richtige Position verschieben. Das Spiel ist auch über WLan oder UMTS als Multiplayer-Game anwendbar. Wer am schnellsten die richtige Reihenfolge gefunden hat, gewinnt. 3G 3 Schwierigkeitsgrade via Länge der wiederzugebenden Songs einstellbar. 9 Nach jedem Spiel erscheint eine Winner-Notifcation mit aktuellem Punktestand. 4 Several concepts for mobile apps were created when Sony Music asked for ideas to integrate their songs or artists within an entertainment approach. The concepts on this and the following page show: A game for playing with waveforms and lyrics of music tracks, styling and controlling a dance avatar by your mobile and a GPS based treasure hunt. Andrej 78 points David 68 points OK Steve 53 points Nando 39 points Share deine Ergebnisse mit deinen Freunden via Twitter und Facebook. 11

9 UX Design Mobile Apps for Sony Music Rag Dance LYRICS SORTIEREN Rag Dance LYRICS SORTIEREN Rag Dance LYRICS SORTIEREN Gyroskop Sensor Steuerung In die Hocke gehen und Springen Drehen Saltos Gesicht Facial Generator Farben bzw. Texturen Projektion des eigenen Gesichtes Haare Verschiedene Haar-Stile Farben bzw. Texturen Kleidung Shirts, Jacken, etc. Hosen, Röcke, etc. Strümpfe, Schuhe, etc. Create & Share Verbreitung der generierten Inhalten In-App Auflistung und Voting Share via Social Networks TOP DANCE ACTS By Arist: Beyonce Ursula + Larissa Naderutti Vorgefertigte Stile Eigenkreationen mit unbegrenzten Kombinationsmöglichkeiten Store Accesoires Brillen, Hütte, Schals, Schmuck Viele Möglichkeiten für In-App Payment FAN SWARM LYRICS SORTIEREN FAN SWARM TREASOROUS LYRICS SORTIEREN Virtuelle Fan-Gebiete sind auf der Karte definiert User bzw. Fans der jeweiligen Künstler checken sich in diese Gebiete ein K. Clarkson Fans Beyonce Fans TREASOROUS Wettbewerb und Teamgeist wird durch Ranking- Listen gefördert User die sich im Spot befinden können per Chat kommunizieren Das Gewinnspiel der anderen Art 19 Symbiose aus virtueller und realer Schatzsuche (Schnitzeljagd) FAN SWARM LYRICS SORTIEREN 1. Woche 2. Woche Beyonce K. Clarkson Bushido 10 2 Fangemeinden Check-Ins 1. K. Clarkson Beyonce 4123 Anreize: Fan-Ranking auf der Seite des Künstlers (Web, Facebook) Persönlicher Gruß des Künstlers an größten Fan Gewinne (Materiell + Immateriell). Ranking: Künstler mit der größten Fangemeinde Loyalster Fan eines Künstler / aller Künstler Augmented Reality Hinweise und Rätsel werden direkt in die Umgebung eingebettet. Mittels Smartphones der neueren Generation (z.b. iphone 4) können bei eingeschalteter Kamera-App Informationen in das Bild integriert werden (siehe Video). 3. Bushido 332 Fan Check-Ins 1. Naderutti Benacci Russolini 5 Erlös: Gewinne der kostenlosen App-Variante werden durch geobasierte Ads generiert Kostenpflichtige Premiumvariante ohne Ads Klick again to play this video! 20 21

10 Scribbles MSN Extreme Portal for Microsoft EXTREME EXTREME Frontebene Headup-Displayebene Hologrammebene For the launch of the Internet Explorer 9, DECADE ONE was asked to create a brand new version of the Microsoft MSN portal that would demonstrate the different HTML5 support-channels and its new features. The vision, called MSN Extreme was developed to highlighten the potential of transforming a classical programmed web page like the MSN portal into an impressive, interactive 3D site by using HTML5. The showcase special Earth Attack allows visitors to experience an exciting space adventure and explore our solar system interactively and in 3D without the need for any third party plug-ins. The multimedia website shows the convergence of videos, classical text contents and navigation tools offering equally information and entertainment. Being the world s first big showcase for the new HTML5 technology implementing 3D contents for expanded user experience this project allowed DECADE ONE to contribute to a further milestone of the world wide web.

11 Design MSN Extreme Portal for Microsoft

12 UX Design MeAndYou Dating Website: Styleguide, Wireframes and Information Flow Charts MeAndYou Entdecke dich selbst und wer zu dir passt. News Einstellungen Hilfe Logout MEIN PROFIL MEIN LEBEN FREUNDE FLIRTS PARTNERSUCHE PARTNERVORSCHLÄGE Steffanie, 28 Verkuppeln Merken Absagen Aktuelle Sucheergebnisse: 2/34 Offline: Letzer Login: < 2 Tage Über mich: Von einem Freund Von mir Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. Angaben bestätigen Basiseigenschaften Geschlecht: Weiblich Realitätsnähe 65 % Antwortzeit: <5 Tage Matching: 87 % Nachricht schreiben Kompliment machen Dateanfrage stellen Überlagerung Sexuelle Orientierung: Hetero Größe: 174 cm Alter: 28 Jahre Wohnort: München Suche nach: Beziehung Anzahl Kinder: Keine Größe: 174 cm Alter: 28 Jahre Wohnort: München Suche nach: Beziehung! Anzahl Kinder: Keine Wohnort: Suche nach: München Beziehung Anzahl Kinder: Keine Erscheinungsbild Zurücksetzen Zwischengespeichert Senden Beruf und Familie Als Rechtswiedrig melden Nachrichtenverlauf Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. Me: Selbstanalyse + Freizeitplanung Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem :23 Ungelesen Zurückziehbar: 2:33 Nachricht zurückziehen Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. The creation of the complete new dating service MeAndYou started with concept papers, went through a long wireframe phase and ended at designs that were refined by the usage of A/B tests to get the maximum User Experience (next page). Lorem Persönlichkeits- ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Verhalten auf dem Studie Aenean massa. durch Cum Online sociis natoque penatibus Lebensplaner et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Portal Diary :23 Gelesen: :02 Ego-blume Aussenblume After the launch of the website MeAndYou needed ongoing concepts and designs for the complete marketing campain to introduce the service (next but one page). Companion Effektivblume Persönlichkeitsfindung und -entwicklung

13 Design MeAndYou Dating Website

14 Design MeAndYou Dating Website: Marketing

15 Design 3D microsite for Audi s annual report In order to present the figures and results from Audi s annual report 2010 in an innovative and interactive way, a modern, corporate style 3d environment has been created that enabled users to experience a smooth navigation through all the contents.

16 Information Architecture Microsite for the 90th anniversary of Haribo Goldbears Sitemap der Promotion Microsite Foto-Montage Webcam upload Datei upload Speichern und Download Filesystem Landing Page Du und der Goldbär Foto-Montage Foto per Webcam / Upload Editor: 3D Goldbär + Gimmicks hinzufügen Galerie So geht s Abfrage -Adresse Bestätigung Teilnahmebedingungen Code eingeben Goldbären Geschichte Gewonnen? Gewinnspiel Code Generator Beantwortung von Fragen Erhalt eines Codes Die Gewinne So geht s Daten, Locations Truck Tour Link zur Galerie TV Spot Partnerseite/Links Video aufnehmen Formular Danke + Info Grußvideos Galerie Erstellung Motiv Auswahl, Skalieren, Arrangieren Rendern Abfrage, Abfrage Dateneingabe, Validierung Erstellung Danke-Screen Anzeige, Blättern, Suche Direkteinstieg Galerie Einfügen in Galerie Teilen, Facebook, VZ Backend Ansicht und Bestätigungsfunktionen Admin Backend Datensatz Anlegen Datensatz freigeben Datenbank Mailing mit Freigabe Direktlink in Galerie Mailing Ablehnung mit Aufforderung zum Neuanfang Mailing Foto Download Foto Upload in Galerie Teilen (FB / VZ) Bei Ja: Erfassen der Teilnehrmerdaten Danke für die Teilnahme Zur Landing Page -> Zur Galerie Bewerbung zum Goldbären Besuch Bewerbungsformular Bestätigung Teilnahmebedingungen Videos für Geburtstagsgrüße Danke Aufnahme eines Grußes mit Webcam AdressveriÞzierung Danke Screen Anlegen Backend Filesystem Datensatz anlegen Datensatz freigeben Ansicht und Bestätigungsfunktionen The microsite for the 90th anniversary of Haribo Goldbears 2012 covered features like a 3D helix of the Goldbear history, an interactive photo composition with the Goldbear as well as a competition to win various prizes. These charts show the site architecture and the connections between several back-end systems. Galerie, Blättern, Direkteinstieg Flash Admin Backend Datenbank Mailing mit Freigabe Direktlink in Galerie Mailing

17 UX Design Microsite for the 90th anniversary of Haribo Goldbears Wireframes were created to visualize the complex processes and interaction elements within the different areas of the site.

18 Design Microsite for the 90th anniversary of Haribo Goldbears

19 UX Design Customer Service Platform for a major insurance company Geteiltes Wissen: Wireframe Smartphone: Wireframe Dein Schönes Leben EIN SERVICE DER ALLIANZ SMARTPHONE APPS Dein Schönes Leben EIN SERVICE DER ALLIANZ DER EINE RAT TRAVEL WALLET Immer dabei und sicher: Alle wichtigen Dokumente auf Ihrem Smartphone. 74 % DIE NEUE WETTER - APP HOUSE HUÖNTER 74 % TEILE DEIN WISSEN! > JETZT IM STORE HOLEN! ALLIANZ APP AUSGEZEICHNET DER ALLIANZ AGENT FINDER WURDE VON.. NAME MAGIC BUTTON 74 % DEIN RAT / DEINE STORY ALPHA VERSION ERSCHIENEN ALLIANZ APP AUSGEZEICHNET DER ALLIANZ AGENT FINDER WURDE VON.. > ABSENDEN SABINE MAIBERGER 74 % Eine neue Stadt, ein neuer Lebensabschnitt und neue Erfahrungen. Es hat mir gefallen, ich konnte so sein wie ich wollte, da mich keiner kannte und auch nicht viele Mein Plan des Lebens: Wireframe Dein Schönes Leben EIN SERVICE DER ALLIANZ MEIN PLAN DES LEBENS Login TOP 10 FAMILIE REISE MOBILITÄT... Kategorie Kategorie HUANG XING Kategorie Kategorie SABINE MAIBERGER HUANG XING HUANG XING Eine neue Stadt, ein neuer Lebensabschnitt HUANG XING Event + Event + i i SUCHE FILTER Event Event + Event + i i + Event + i i These wireframes show the User Experience Design and layout for the different spots of the new Customer Service Platform of a major insurance company that relate to various common situations of customers. Planen Wizard Kalkulieren

20 Information Architecture Customer Service Platform for a major insurance company Life Tool... Seitenstruktur... Die derzeitig geplante Seitenstruktur bewirbt die neuen Services der Allianz über den Homescreen. Sie werden nach Aktion über ein normiertes Overlay-Fenster über der Allianzseite angezeigt oder angeteased. Es können alle Services im Overlay angewählt werden. Die Inhalte laufen auch auf eigenständigen Seiten. Homescreen Overlay (iframe) Contra... Overlay ist im Web ungern gesehen (nur für Bilder oder Werbung) --> Abschreckung vieler User Komplizierte Linking-Strategie: Overlay Teasering verlinkt zur direkten Serviceseite, verlängert den Weg zum Ziel, kostet wertvolle User und sorgt für Verwirrung Der eine Rat direct service App Store teaser page Life Tool teaser page Direkte Bewerbung einzelner Services innerhalb des Homescreens steht in Konkurenz mit den Overlay-Links. --> Linking Divergenz Pro... Schöne Idee / Sinnvolles Tool Spieltrieb wird angeregt Elegante Möglichkeiten der Verknüpfung mit der Allianz Komplexes und dynamisches System Hohe Kundenbindung kann erziehlt werden Zoomfunktionalität Contra... Design erinnert an DNA Analysen: Negativ behaftet und hemmt die User, ihre realen Daten preiszugeben --> Gläserner Mensch Service spiegelt nicht seine eigene Thematik wieder: Leben! Farbkodierung ist zu komplex und von der Masse nicht erlernbar --> Usability Problem Zu wenig individualisierbare Darstellungsmöglichkeiten: --> Zu festes Raster Spieltrieb wird zu wenig ausgenutzt Lösungen zur freiwillige Dateneingabe sind nicht ausgearbeitet: Spaß am Dateneingeben fehlt The exisiting structure of the current site had to be analysed to come up with a much straighter and easier-to-understand proposal. Direct pages Der eine Rat App Store Life Tool Starker Verlust im Suchmaschinenranking durch inhaltliche Nutzung von Overlays Navigationen innerhalb von Overlays führen zu Problemen mit den Historienfunktionen und Lesezeichenoptionen einiger Browser --> Verwirrung beim User Inkonsistentes Inhaltskonzept: Der eine Rat deutet auf eine direkte Verwendung hin, das Life Tool verlinkt auf den direkten Service und der App Store ist eine Mischung aus beiden --> Verlust der Vertrauensbasis Seitenstruktur... Unser Ansatz ist es, ein einenständiges Portal zu etablieren, dass alle Services unter einem Dach vereint. Es läuft auf einer eigenständigen Domain. Services sind direkt aufrufbar über domain/servicex Homescreen Vorteile... Höhere Akzeptanz, da die geschäftlichen Absichten der Allianz in den Hintergrund treten DeinSchönesLeben.de Bindung zur Marke Allianz wird erhöht durch bessere Darstellung des Service-Gedankens Keine Overlays für die Bewerbung notwendig Höheres Suchmaschinenranking Eindeutige Informationsstruktur Der eine Rat Life Tool App Store Lineare Linking Wege, mit Backlink-Möglichkeiten zur Allianz.de Es werden keine Schnittstellen benötigt Technische Freiheit zur Steigerung des Kommunikationseffektes Bessere Usability

21 Design Customer Service Platform for a major insurance company Globalnavigation Anmutungen... The final design was based on mood snapshots that created the look and feel of three different interaction scenes.

22 Design UBC Corporate Website The UBC website is a website of an outstanding carbon producer for the Formula 1. Therefore a modern type of design was created for this corporate site where 3D animation integrates borderless into 2D space. The result was an emotional and at the same time easy to use website.

23 Design MAYK AZZATO Portfolio Website The task was to design an extreme minimalistic website for one of the best photographers in Europe - Mayk Azzato. A very simple intuitive but innovative navigation system focuses the users attention to the pictures of the photographer. This site won the Webby Award in the category photography.

24 Design Lady Gaga / Nokia concept paper Concept description: The LADY GAGA MUSIC & LIFESTYLE COLLECTION with the Nokia X6 offers a complete & exclusive package including music, video and exclusive lifestyle experiences, all selected by a creative team headed by LADY GAGA herself.

25 Design Christiano Ronaldo / Audi concept paper Concept description: Star photographer Mayk Azzato creates a high-quality photo spread of Christiano Ronaldo in an unprecedented worldwide exhibition, taken by Azzato himself. The pictures impersonate the soccer players character in association with the brand attributes of AUDI. People experience Ronaldo s everyday life in keeping with the marque in a personal, emotional and fascinating way they ve never seen before.

26 Design Youth Portal for the DLR (German Aerospace Center) A colourful and futuristic design has been developed to meet the requirements of the Youth Portal of the German Aerospace Center. Various modules have been created to visualize subjects like research, history or space travel.

27 UX / Design Burda Yukom Website Relaunch Konzept Burda Yukom Für die Realisierung werden diverse Verknüpfungstypen generiert. Es gibt für den User unsichtbare Verknüpfungen (zb. Titel, Text und Bild), linear sichtbare Verknüpfungen, die mit einer einfachen Verbindung wie einem Pfeil, einer Linie oder ähnlichem dargestellt werden (zb: Anzeigenmotiv A --> Anzeigenmotiv B --> Anzeigenmotiv C) und erklärende Verknüpfungen, die mit einem speziellen Symbol auf der Linie oder dem Konzept Burda Yukom Pfeil angelegt sind. Case- und Produkt-Bereich - Die Ebenen: Beim Klick auf die erklärende Verknüpfung öffnet sich diese und zeigt genauere Inhalte, die den Zusammenhang mit wenigen Worten erläutert (zb. Verknüpfung: Print und Mobile; Erklärung: Zeitschrift mit einem Code, Handy fotografiert Code und schickt ihn an Firma, Nutzer bekommt SMS mit Gutschein und Weblink zurück). Die bisherige sinnvolle Struktur der Burda Yukom Webseite wird größtenteils beibehalten. Im Cases Bereich kommen allerdings drei prägende innovative Elemente hinzu. Um zum letzten Punkt bzw. zur vorherigen Ebene zurückzugelangen, reicht ein Klick auf den Zurückbutton, der vom zuletzt gewählten VerDas erste Element sind gestapelte dreidimensionale Ebenen, in die der User plastisch wieder eindringen kann. Die angeschaute erste Ebene ist der Startpunkt der knüpfungspunkt auf das zuvor Element springt. So Cases. Wenn der User von hier aus in die nächste Ebene (z. B. von Print zu Web) springt, wird dreidimensional eine neue Ebene geöffnet, in wird ein Orientierungsverlust des Users effektiv vermieden. die man gleichsam eintaucht. Analog dazu tritt der User bei umgekehrter Reihenfolge aus der bisherigen Ebene aus und steigt eine Ebene auf. Vorstellen kann man sich dies als eine Art Raumsprung (Tauchgang), bei der sich der User den Größen der Umwelt anpasst. Er startet z. B. im weiten Weltraum mit entfernten Planeten, fährt auf die Erde zu, springt von dort auf Europa, danach in eine Stadt, dann in ein Haus, auf einen Schreibtisch und schließlich in einen Mikrokosmos in dem alles aus Atomen und Elektronen besteht. The new web concept for the publisher Burda Yukom integrated the handling of content, pictures and their clients. The futuristic design on the right offered a brand new way of accessing content.

28 Product Design Beauty MagiXX

29 Design Ride for Green brand, website and presentation