TFL. Unser Web muss schöner werden IN STORIES THE OTHER WE TRUST HUMDRED DESIGN MADE IN GERMANT CREATIVE BUSINESS

Transkript

1 A R TFL Karl Anders.) DA HABEN WIR DEN OBSTSALAT IN STORIES THE OTHER WE TRUST HUMDRED ste.r...,inion Are. EUROBEST TEXTER FESTIVAL GESUCHT Med. r...-fiepte h-11.9e et rens**"...euleest MA/ re. e Lauben STIMME DER KREATIV WIRTSCHAFT len.brimelentle - CREATIVE BUSINESS DESIGN MADE IN GERMANT Unser Web muss schöner werden Im Webdesign heißt es gründlich umdenken. Die visuellen Ansprüche der User an das neue Leitmedium steigen, gleichzeitig wirft die Vielfalt der Devices technisch alles durcheinander. Alte Rezepte funktionieren nicht mehr REINVENT TOURSELF RIESEN DER MEERE Doce,r. NU*, P11412Wee DIE KREATIVE KLASSE MENSCHEN PRÄGEN MARKEN EVA ROCKT UND LOCKT»yenftlem ta Zwischen hippen Designs, wie sie die einschlägigen Online-Showcases ä la FWA oder Awwwards zeigen, und der alltäglichen Arbeit im Auftrag von Kunden klafft eine tiefe, tiefe Lücke und die scheint in Deutschland oft noch etwas tiefer zu sein als etwa in Großbritannien oder Skandinavien. Woran liegt's und was sind die aktuellen Ansprüche an zeitgemäßes, attraktives und funktionales Webdesign? Welche Probleme und zugleich Chancen bringen Trends wie Mobile First, Fiat Design, bildschirmfüllende Bildwelten, Interactive Video, Webfonts, Single-Page- Sites oder Parallax Scrolling? Wir haben provokative Thesen aufgestellt, dazu dann Statements führender Webdesigner eingeholt und spannende Fallbeispiele gesammelt. cg Siön Prys NIOUTE. 1. aboui Wrte1 vincent Dolman n 1,i1.11 _, - - OLYMPIANS Paul Woodd- Walkvr ,,Lwv- ^ HELEN MACINTYRE 7 PAGE Online Alle Links zum Artikel finden Sie unter schoeneres web EINE NEUE IKONE DIMMER CASINO BERLIN SELECTED PROJEtT.'12:2,.;,; Praktisch modular und typografisch unverwechselbar: Karl Anders hat alles richtig gemacht TRIMM DICH PFAD FÜR GUTE GESTALTUNG MMII BLEIBT IM GEDÄCHTNIS DAS IST ERST DER ANFANG Richard Penna zeigt Arbeiten seines Studios Nioute mit Webfonts, die schon einen Vorgeschmack auf das jeweilige Projekt geben Mandy Coakley Re resents ROBERT FRAMPTON Smith McLeod ->

2 DIESEL Women's Coiinnnon C o, nr, Art Die New Yorker Agentur Helle Mondag nutzt auf der neuen Diesel-Site nur flache Bedienelemente No one lives here ION ifax. Viele Webdesigndienstleister können besser programmieren als gestalten. Liegt es an der Firmenstruktur und Personalpolitik oder an der Ausbildungssituation, dass viele Digitalagenturen besonders in Deutschland eher technisch als gestalterisch ausgerichtet sind? Bekommt der Kunde bessere Websites von Agenturen, die eigentlich keine Interactive-Spezialisten sind, weil sie mehr Design-Knowhow haben? Roman Hilmer, Geschäftsführer Kreation Fork: Wir glauben an gutes Design. Vielleicht glauben andere nicht an gutes Design. Oder, wie es beim Thema Glauben häufiger vorkommt, sie glauben an ein anderes gutes Design. In manchen Gesprächen haben wir den Eindruck, dass gutes Design in Deutschland verpönt ist. Wir erleben immer wieder, dass davon ausgegangen wird, dass gutes Design nur Designer selbst sowie die gehobenen Schichten anspricht und dass man die breite Masse nur mit prolligem [sic] Design erreichen könne. Vielleicht verhalten sich darum einige Agenturen zu pragmatisch und legen mehr Wert auf Programmierung als auf Design. Auch bei Bewerbungen von Webdesignern fällt auf, dass viele sehr pragmatisch, vielleicht etwas zu pragmatisch vorgehen. Sie greifen sich die zeitgeistigen Standards und trendigen Effekte und legen los, ohne länger über die eigentliche Designaufgabe nachzudenken. Yeliz Üney, Business Director Hi-ReSl: Ich glaube nicht, dass gestalterisches Know-how fehlt. Natürlich gibt es eine enorme Bandbreite von Anbietern, der Trend geht immer mehr zu Kleinstagenturen. Aber Expertise ist im deutschen Markt durchaus vorhanden. Ich könnte mir vorstellen, dass Unternehmen häufig schon einen technischen Dienstleister haben und das Webdesign dazukaufen. Aber alles, was sich im Frontend abspielt, muss in einer Hand bleiben. Sonst entstehen Sollbruchstellen, wenn ein Design an einen technischen Dienstleister übergeben wird und dann Entscheidungen zwischen Kunde und Dienstleister getroffen werden, die Auswirkungen aufs Design haben. Alexander El-Meligi, Geschäftsführer demodern: Viele Digitalagenturen werden nicht von Kreativen oder Designern geführt, sondern von Betriebswirten, Ingenieuren oder Informatikern. Dadurch ist der Anspruch an das Design verständlicherweise nicht derart ausgeprägt, da eventuell technische Ziele höher priorisiert werden. Aber gerade durch die steigenden Nutzerzahlen und die massive Verbreitung von Apps et cetera setzen die Konsumenten inzwischen neben den rein technischen Funktionen eine visuell anspruchsvolle und sinnvolle Gestaltung voraus. Wie flach darf/ soll eine Website sein? Der Lederlook von ical ist ja angeblich von den Nähten an den Sitzen in Steve Jobs' Privatflugzeug inspiriert. Ich habe solche Imitate von Materialien wie Leder, Alu oder Glas schon immer verabscheut und mit einem Helferlein aus dem Netz den Kalender so- Cfosest Store Desel S ads Gold rol, Women's Apparn: 1 W Deflint noee.momuen Man s Demirel Deo,npon, 1.0-1,031 Women's Fonn,ear Sem,. Veuld,13 Mem' Women's Eyeviee Men's Eyewear / ,11 fort»entskeuomorphisiert«. Doch es gibt Hoffnung: Nach dem Abgang von i0s-chef Scott Forstall will Jonathan Ive anders als Jobs und Forstall kein Fan des Pseudo-Analog-Looks neue Wege gehen. Die Frage reicht allerdings tiefer als eine Aqua-Oberfläche: Fallen Verläufe, abgeflachte Kanten oder Schatteneffekte auch schon in die Kategorie des derzeit viel geschmähten Skeuomorphismus? Selbst wenn das Londoner Design Museum es zu einem der Designs of the Year kürte, muss man das Windows8-Patchwork nicht lieben. Doch flache, modulare Layouts werden wir künftig allein deshalb öfter sehen, weil immer mehr Sites dem Motto»Mobile First«folgen. Farbflächen kommen mit weniger Kilobyte aus als skeuomorphe Bilddateien und sortieren sich im responsiven Webdesign mühelos neu. Beispiele sind logischerweise im sogenannten Modern UI die aktuelle Website von Microsoft oder die neue McDonald'sSeite, umgesetzt von Razorfish. Für Ham- und Cheeseburger interessiert man sich eben hauptsächlich, wenn man unterwegs ist. Thomas Junk, Geschäftsführer demodern und 2013 Mitglied der ADC-Digitaljury: Eine oft durch das Zitat des Bekannten als Skeuomorphismus ins Interfacedesign gebrachte Haptik und Vertrautheit senkte die Hürde, sich mit einem neuen Medium auseinanderzusetzen. Wir sind jetzt aber an einem Punkt angekommen, wo das Gros der Bevölkerung täglich im Kontakt mit digitalen Schnittstellen steht. Da darf das Interface wieder»es selbst sein«. Matt Harrop, Kreativdirektor Fork: Das Revival von minimalistischem flachem Design scheint eher eine Revolte gegen Apples Pseudorealismus zu sein als ein passender visueller Stil für eine neue Technologie. Es ist eine nette Abwechslung und hat einige schöne Anwendungen hervorgebracht, kann aber auch zu weit gehen und die Usability behindern. Soll ich klicken? Soll ich wischen? Soll ich pin- ißt So lassen wir uns Skeuomorphismus gefallen: Website von Fl@33 für die Ausstellung»Ne (line lives here«des Londoner Royal Collage of Art. Der notumailuatmeal al c CIZOCCIIIMIC fil MBIU : UNIIIIM.1116,111. chen? Googles neuer Look (beispielsweise bei der Google-Maps-App) ist ein gelungener Mittelweg: flach, aber mit Texturen und Schatten als visuelle Referenzpunkte. Nicht so gelungene Fallbeispiele: Der Mobile-First-Ansatz ist perfekt, um sich aufs Wesentliche zu konzentrieren, schießt manchmal aber übers Ziel hinaus: Nach dem Relaunch sieht thenextweb.com auf einem 27-Zoll-Monitor aus, als sei sie für Senioren oder Sehbehinderte gestaltet. Andererseits begegnen einem derzeit öfter Sites, die eher den Look von Modern UI als dessen Funktionalität nutzen. So die neue WWF-Site, die flach und scheinbar modular daherkommt, dies auf mobilen Devices aber nicht responsiv umsetzt. Beim neuen Stadtportal Heidenheim. de funktioniert das zwar auf iphone und Co, aber es kachelt nur auf der Startseite, danach werden die Kacheln zum funktionslosen Headermuster. Ein ähnliches Phänomen wie beim Trend zu großen Bildern, die sich auch oft nur auf der Startseite finden. Dann geht's kleinteilig weiter wie eh und je... Wir wollen wieder was erleben! Selbstverständlich reicht es nicht immer, wenn Websites nur flach und praktisch sind. Manchmal wollen die User auch in spannende Erlebnisräume eintauchen. Aberwie gehen Rich Media und Immersion ohne Flash? Interactive Video oder das für die Darstellung animierter interaktiver 3-D-Welten ohne Plug-in nutzbare WebGL werden das in Zukunft mit Sicherheit immer häufiger möglich machen. Doch der Weg dorthin ist technisch nach wie vor holprig. Wir fürchten, dass es nicht deutsche Designer sein werden, die hier die Vorreiter abgeben... Screenshot zeigt nur einen Teil der Fläche, die man am Monitor stückchenweise erkundet

3 EZ7 yourwaytooz.com oder die überwiegende Zahl der Google-Lab-Projekte wie Mr. doob et cetera. Aber wenn es nicht nur Parallax Scrolling in HTML5 sein soll, sondern wirklich eine einzigartige und beeindruckende Inszenierung, nimmt die Cross-Platform-Optimierung noch sehr viel Zeit und Budget in Anspruch. Mit Flash erreicht man auf Desktops immer noch die beste Performance und Reichweite. Eine für alternative Devices optimierte Anwendung ist sowieso meist wünschenswert. Man sollte also früh und transparent mit dem Kunden über Vor- und Nachteile der jeweiligen Lösung sprechen, um das ideale Konzept zu entwickeln. Wer kann Interactive Video? Egal, welche Techniken auf Dauer Flash für opulente Animationen ablösen, die Arbeit von Digitalagenturen wird das nicht fundamental ändern. Bei Video sieht das anders aus - auf Dauer ist bildschirmfüllende Qualität auf Werbefilmniveau gefragt, von Regie über Ausstattung bis zur Technik. Plus zusätzliches Know-how, denn das Video soll ja interaktiv sein. Ein Job für hochkarätige, disziplinenübergreifend arbeitende Spezialisten. Wie die der französischen Agentur Fighting Fish, die mit Wunderman Paris die links gezeigte Website für Nokia realisierte. Aufwendiger als ein Werbefilm: die Site die die neue Fähigkeit von Lumia-Smartphones kommuniziert, Gruppenfotos erst zu schießen, wenn alle stillhalten imatt Ha rrop, Kreativ,. direktor Fork: ^ - Nirgends kommt der Kunde in so engen aktiven Kontakt mit der Marke wie im Internet. Das ist eine große Chance und gleichzeitig eine große Gefahr, denn jede falsche Bewegung kann ihn für immer verscheuchen. Vor allem in Deutschland meiden viele Marken deshalb jedes Risiko und bieten brave, faktenbasierte Rationalisierungen der Vorzüge ihrer Produkte. Rationalität spricht einen bestimmten Typ Kunden an und sollte eingesetzt wer- I den, wenn es passt. Aber auf emotionalem Wege lässt sich eine damit unvergleichliche Motivation und aktive Nähe zur Marke erzeugen. Marken sind mehr als ihre Produkte, sie sollten aufhören zu rationalisieren, tief in ihren Markenkern eintauchen, um laut und stolz die Werte zu kommunizieren, für die sie stehen. Alexander El-Meligi, Geschäftsführer demodem: Dass man auch ohne Flash schöne Erlebnisräume eröffnen kann, zeigen aktuelle Seiten wie IV Große Bilder, viele Bilder... gute Bilder? Einer der aktuellen Trends hin zu attraktiverem Webdesign heißt große Bilder. Doch damit - und der steigenden Auflösung von Desktop- und Mobile-Displays - wachsen die Anforde- rungen an die Qualität der Fotos. Billigbilder von Plattformen, die einst nur entstanden, um den Hunger des Webs nach Lo-Fi-Fotos zu befriedigen, reichen da nicht mehr. Sind bei Digitalagenturen bald Shootings mit bekannten Fotografen ebenso Standard wie in der Printwerbung? Werden dort Artbuyer arbeiten, um das nötige Knowhow einzubringen? Thomas Junk, Geschäftsführer demodern: Die Wirkung zählt: Mit wachsendem Selbstbewusstsein und steigender Anforderung an beeindruckende Inhalte werden Digitalagenturen immer öfter zum Koordinator der eigentlichen Inhaltsproduktion. Andreas Henkel, Projektbuero.HenkelHiedl: -- Nehmen wir die Zahnarztpraxis Kniha & Gahlert. Die machen, was Tausende andere Zahnärzte auch machen. Was an ihrer Arbeit gegebenenfalls besser ist, ist im Detail zu komplex, um es mal schnell zu vermitteln. Die Summe dieser Details lautet: Ästhetik. Und für die Vermittlung genau dieser Botschaft sind Fotos sehr guter Fotografen unerlässlich. Fallbeispiel coffeesurfing.illy.com: Welche kreativen Möglichkeiten höhere Ansprüche an die Fotografie im Web eröffnen, zeigen Projekte wie das von Gabriele Galimberti für die Kaffeemarke illy. Der italienische Fotograf, der sonst für»newsweek«,»la Repubblica«oder»Vanity Fair«arbeitet, hatte gerade einen 18-monatigen CouchsurfingTrip um die Welt beendet, als er wieder losgeschickt wurde - diesmal zum Coffee Surfing. Dabei besucht und fotografiert er Menschen, die ihm bei einem Kaffee ihre persönliche Glücksgeschichte erzählen. Eine Idee des Designstudios Dolcestilnuovo aus Modena, das aus Fotos und Geschichten eine Website mit Splitscreen-Scrolling-Effekten bastelte. Die Site startete im Februar diesen Jahres - und lädt Interessenten zum Mitmachen ein. Seither ist Galimberti in europäischen Metropolen unterwegs und trinkt dort mit fremden Leuten Kaffee. Lust darauf, sich von einem Profifotografen zu Hause porträtieren zu lassen? Die Kampagne httplicoffeesurfing. illy.com macht es möglich F4 Fallbeispiel herzo.adidas-group.com: Herzo was? Potenzielle Mitarbeiter aus dem Ausland nach Herzogenaurach zu locken, ist nicht leicht... Thorsten Konrad kreierte deshalb für adidas eine Recruiting-Site, die durchweg auf bildschirmfüllenden Fotos und Videos beruht. Jens Franke stand ihm konzeptionell sowie als Entwickler zur Seite und lieferte zudem attraktive Fotos, die auf seiner dreimonatigen SabbaticalFußreise durch den Süden Deutsch- lands entstanden ( franke.com). Dazu kommen Videointerviews mit adidas-mitarbeitern aus aller Welt in Herzogenaurach. Dabei arbeitete Konrad mit dem in Berlin lebenden israelischen Filmemacher Shai Levy zusammen - und einem amtlichen Team, zu dem auch ein zweiter Kameramann sowie ein Ton- und Kameraassistent gehörten. Bilder und Videos sind auf eine Karte gepinnt, sodass sich die Site wie ein Reiseführer o.,.kniha GAHLERT DIE ARZTE DIE PRAXIS GRUNDWERTE WAS WIR TUN RUNDGANG ANGST? Seit dem Launch KONTAKT von gahlert.de mit Fotos DIE FORSCHUNG von Thomas Straub bekommt HenkelHiedl Anrufe von Zahnarztpraxen, die auch so eine Seite und vor allem solche Fotos wollen

4 OJALA WERKE WORKING GERMANY LIVING WIR SIND, WAS WIR WIEDERHOLT TUN. EXZELLENZ IST DAHER KEINE HANDLUNG, SONDERN EINE GEWOHNHEIT. mchr,ura G,,,, Die Recruiting-Site von Thorsten Konrad und Jens Franke lockt mit großen Bildern nach Herzogenaurach Puristisch: der neue Onlineshop von Ojala Werke für die Königliche Porzellan-Manufaktur Berlin. Infos und Preise werden auf kpm-berlin.com nur bei Mouse-over sichtbar wie im realen Showroom, der sich ohne Preisschilder aufs sinnliche Erleben der Produkte konzentriert 000, 9 nutzen lässt, aber zusätzlich auch ganz schlicht wie eine PowerPointPräsentation mit den Pfeiltasten auf der Tastatur. Außerdem: Neben dem Trend zu XLFotos gibt es den zu vielen Bildern, oft im Pinterest-Style wie bei der neuen H&M-Marke & Other Stories oder als Foto-Videoclip-Mosaikwie bei der FilmWebsite Hier sind Bilder zweckmäßig, transportieren Informationen oder Atmosphäre. Wenig Sinn macht Bebilderung um der Bebilderung willen, etwa bei der Tech-News-Seite ReadWrite. Am Fließband immer wieder Visuals für die gleichen abstrakten Technik- oder Branchenthemen finden zu müssen, kann einfach nicht gut gehen. Endlich wird das Web typografisch wachgeküsst! Erst jetzt, wo die ganze Schriftenvielfalt nicht mehr nur als Bild, sondern in flexibler, fließender Form zur Verfügung steht, ist Typografie wahrhaft digital und spielt als Gestaltungselement eine ganz neue Rolle. Eine Rie- senchance, aber auch eine Herausforderung für Webdesigner, die bisher bloß das Handling einer Handvoll Schriften gewohnt waren. Ebenso wie beim Thema (Bewegt-)Bild gilt: Sofern entsprechendes Wissen inhouse nicht verfügbar ist, müssen Digitalagenturen Spezialisten heranziehen, wenn sie Arbeiten auf höchstem Niveau abliefern wollen. Nehmen wir die auf Seite 18 gezeigte, wunderbare neue Site der Hamburger Corporate-Design- und Werbeagentur Karl Anders, die offenbar das Glück hat, einige Typocracks in ihren Reihen zu haben... Lars Kreyenhagen, Managing Partner Karl ',ie. Anders: Die Fließtextschrift Apercu Regular von The Entente aus London und die Apercu Bold für Auszeichnungen sind unsere Hausschriften, die wir auch in Print nutzen. Die Headlinetype Karl_ Eins ist eine Eigenkreation von Ann Eckert, die bei uns als Designerin arbeitet. Als sie uns die Schrift irgendwann zeigte, war sie noch nicht ganz fertig. Aber dann haben wir uns bei unserem Redesign auf die Schrift eingeschossen ein Grund für Ann, sie zu finalisieren. Beim Webfont hat noch Marko Grewe, der ebenfalls bei uns als Designer arbeitet und zufällig das Schriftenlabel Avoid Red Arrows betreibt, mit Hand angelegt. Thomas Junk, Geschäftsführer demodern: Für Headlines und Anleser sind Webfonts gerechtfertigt, allerdings sind viele Druckschriften nicht geeignet, am Bildschirm längere Texte zu vermitteln. Mit dem Einzug der Retina-Displays wird es aber definitiv eine Rückbesinnung auf die klassischen Gestaltungsregeln des Printdesigns geben, und hoffentlich werden Duktus und Erscheinung der klassischen Schriften an die neuen Einsatzgebiete angepasst. Momentan ist immer noch ärgerlich, dass manche Schriften lizenztechnisch einfach nicht verfügbar sind (wie die Gotham von Frere-Jones). Die Fonts sollte man auf jeden Fall auf Cross-Browser-Kompatibilität überprü- fen; denn selbst große Unternehmen bieten Schriften an, die merkliche Unterschiede zwischen Firefox und Safari aufweisen. Ole Schäfer, primetype.com: Oft werden eins zu eins ganz normale Schriften genommen, statt sie von einem Typedesigner für den im Vergleich zu Print niedrigauflösenden Monitor zurichten zu lassen. Die Buchstaben brauchen mehr Luft und deutlich mehr Kontrast zwischen den Strichstärken. Ich empfehle immer, kräftige Schriften und nicht zu geringe Punktgrößen zu wählen. Für Apps lohnt es sich auch, Fonts zu überarbeiten. Meist wird aber nur geguckt, was billig ist und am besten gar nichts kostet. Dazu kommen uneinheitliche Lizenzen. Man muss immer die EULAs, die End User Licensing Agreements, lesen oder nachfragen, bevor man einem Kunden eine Schrift vorschlägt, um sicherzugehen, dass lizenzrechtlich alles abgedeckt ist. III Mehr Weißraum, aber bitte nicht immer weiß! KPM BERLIN KLITSCH KO KUNDLER LOOK54 PILLOW & PEPPER 40SECONDS FESTIVAL OF LIGHTS THINK-THEATRE BERLIN EVENT UVM NEWS IRELAUNCH: PAPERMOLES Hamburg, ahoi! Für die Papermoles Portfoliornanufaktur entwickeln wir zur Stunde einen Online-Shop Für ihre individuellen, mit einem Red-Dot-Award ausgezeichneten Ledermappen. Zur bisherigen Website: JAHRE KÖNIGLICHE PORZELLAN-MANUFAKTUR Wir gratulieren der Königlichen Porzellan-Manufaktur Berlin zum 250. Geburtstag. Die von uns gestalteteneue Website ist nicht nur im Jubiläumsjahr jederzeit einen Besuch wert EINE DEKADE OJALA WERKE Mancher ist kreativ. Mancher ist zuverlässig. Wir sind beides. Und das seit mittlerweile über zehn Jahren. Herzlichen Dank an alle Kunden und Geschäftspartner für das Vertrauen und die Treue. Zu diesem Anlass spendieren wir uns eine neue Identität. Neues Büro (an vertrauter Adresse), neues Logo, neue Website. Herzlich willkommen! Dem BilderOverflow setzt Ojala Werke eine Agenturwebsite entgegen, die ohne Webfonts so nicht möglich gewesen wäre mit der Brandon von Hannes von Döhren aus Berlin, die 2011 beim NC ausgezeichnet wurde TEAM DANIEL OJALA PHILIP ISIK M HAELA NICK Kotet & Emetion Pniekriekrog Oden* tyweä LWeeis. Km.. Fe..H. E.4130.th, ,., NEUMEISTER * E.M.2 uleaben 2,34.1chre.ten HIRCHE 5,4,1,ChIenben SEBASTIAN SCHRAMA 1SIK TIMO FSITSECF7 ER Pro7ommien.49 Pre9ronenzierung Predeklien ! E uieeden E.2742 uhr...an E.,441 FREUNDE ttlwriben PATRICK BABER 44,4444.eng E Ms IMen ANDRA KUNATH Pre44tion..3431enr I CHRISTIAN THONKE Lese GEORG GUILLEMIN 126eneumg9, I CHRISTIAN LIETZMANN Feiepofe BURKHARD PILLER sonne I CHRISTIAN ADLER M JOBS Wir suchen Für unser junges Team ab sofort: Progra mmieredin) mit Schwerpunkt PHP und MySQL Vertiefte Kenntnisse in Magento, TYPO3 und WordPress erwünscht. PDF-Bewerbung mit Deinen Skills und Lebenslauf bitte AIMM Nexuarxhe 5,6.9, m Ct Baden-Württemberg.de 113 Mit hellem Hintergrund und schicken Webfonts ein Art edle Printoptik zu erzeugen ist derzeit schwer angesagt. Beispiele sind der neue Luxuskosmetikshop (mit Flagship-Store in der Oranienburger Straße), von superreal aus Hamburg oder die avantgardistische gerade im Edel-E-Commerce hat sich dieser Look zu dessen Vorläufern zählt derart epidemisch verbreitet, dass manche 9 Möglicher Nationalpark Nordschwarzwald worum geht's? ne Lunoienaur.5 in,. eee 1.1..lpel, eeatereeen te11.[sign. veld,glen Hem 3.1 ne,ledrn Natwebar, ref 1A.IS$ , 9..tar2r Mehr Ohebewerb mehr Verkehr auf der &Nene turtert /en. Paroom Neue Wege in eine geschlechtergerechte Gesellschaft reet as Wo...mann erriete und Die unewelen,, Namenettlellnle. ilnarste ertentteg. CP,(0.KIn ev felnmeninfi gibt ein nen«. eßtnen..p.erfte Senemnoetangteerk. 1: , rmeemcnrwrnveaat elyenen Nuschen pr Wen NOre nun quweee lex// Nin 2061 Für das neue Portal Baden-Württemberg.de übernahm ressourcenmangel die Garamond als Corporate Type für Headlines und Zitate. Dazu kommt die Fließtextschrift Gudea und die Corporate-Designkonforme Eierschalenfarbe als Hintergrund

5 026 CM MZ=I 027 Blumenctdc inumeno MUMM SOLDefltOR rdamen. Blumensträuße im Abo: bei Blumeno.de mit klassizistischer me Typo, Bloomy Dags etwas weniger luftig und mit hinter-,frisch. Edel. Regelmäßig geliefert. pur best legten Headlines Letztere hat auch die funktionalistischer gestaltete Miflora.de 6. 2.der.e. Ejltenrre --> Auftritte einander verblüffend ähneln. Wie die Sites der Abo-BlumenAnbieter Bloomy Days aus Berlin, Miflora aus München und Blumeno.de aus Mülheim an der Ruhr. Nur zur Erinnerung: Weißraum kann auch schwarz sein (sieht immer edel aus, siehe ), monochrom farbig, mit Verläufen oder sogar gemustert Hauptsache, die Inhalte werden schön reduziert und damit übersichtlich präsentiert. Beim Relaunch des Onlinemagazins»Swide«von Dolce&Gabbana versah Hi-ReS! London jede Rubrik mit einer anderen Hintergrundfarbe. Besonders beliebt sind gerade auch mit einem Punktraster zurückgenommene Hintergrundbilder wie bei oder Bi Innen der wegangenen \ Vnelie myself ^emlmtr terel AUE mer.ereeze ramm., f i.r.. FRISCH. EDEL REGELMÄSSIG GELIEFERT. II r frfr,edifriksjperrl./..., BLOOMY DAYS num> AIOntottni MII ts reell77.:-_,.42,7 14: 'FRISCHE BLUMEN,4 OHNE FESTE BINDUNG 19.9Ci JETZT PEST ELL. Scrollen bis der Arzt kommt? SPRING CALL LOLLI POP DIE...Ar. IDEE OH MOCHIL MOOR? NEUES ma BLOOMENFELD LreeK2 2 2;.. r "' "ia,rza17 clie. Freude schenken mir selbst und meinen Liebsten Mit HIFLOR/1.de Oelccoereo.. für mehr Frische und Ästhetik Mit MIFLORA.de Freude verschenken... als Auf merksunken oder Zeichen der Liebe m 131 In Sachen Scrollen hat sich enorm viel getan in den letzten Jahren, sei es durch CSS-Effekte, sei es durch die über Touchpads und -displays gelernten neuen Interaktionsformen. Auch Social-Media-Sites wie Twitter oder Tumblr haben mit ihrem Infinite Scrolling auf andere Seiten abgefärbt zweifellos sehr praktisch, nur die Verlinkung einzelner Themen stellt hier öfters ein Problem dar. Wunderbar sind auch Neuerungen wie Sticky Navigations oder Fixed Headers, die beim Scrollen einfach mitkommen und so immer verfügbar sind. Schwieriger sieht es beim Parallax Scrollingaus, bei dem manche kennen es aus Jugendtagen von lump 'n' runs verschiedene Ebenen sich unterschiedlich schnell bewegen. Es gibt äußerst gelungene Anwendungen wie die zum DVD-Start gelaunchte Making-of-Site zum Film»Life of Pi«. Die sich gegeneinander verschiebenden Ebenen haben hier eine Funktion, zeigen sie doch mit beweglichen Vorher-Nachher-Darstellungen, wie einzelne Szenen entstanden sind. Oft aber lassen sich die Designer selbst zu sehr von den Effekten berauschen, die sie kreieren. Nirgendwo sonst schwirren Typo und Bilder derart verwirrend kreuz und quer über den Bildschirm wie da, wo von»amazing scrolling effects«die Rede ist. Ganz abgesehen davon, dass sich die kunstvollen Verschachtelungen zumeist mindestens so schlecht aktualisieren lassen wie die guten alten FlashZaubereien. Nur ein Hype ohne große Zukunft also? Thomas Junk, Geschäftsführer demodern: Für die wachsende Zahl von Touch-lnterface-Usern und Ma usradscrollern ist es wesentlich einfacher und intellektuell nachvollziehbarer, Inhalte in der eigenen Geschwindigkeit aufzunehmen, als durch anstrengendes Blättern und Nachladen den Perzeptionsfluss immer wieder zu unterbrechen. Diesen Scrollvorgang mit»effekten«zu belegen, soll mal mehr, mal weniger sinnvoll der Vermittlung der Inhalte dienen und durch überraschende Wendungen den Konsumenten am Ball halten. Für die überwiegende Zahl der Scrollingeffekte reicht allerdings leider die Performance der mobilen Endgeräte häufig (noch) nicht aus, sodass die Annahme, eine HTML5 Seite würde auf jedem Gerät die gleiche Erfahrung gewährleisten, ad absurdum geführt wird. Matt Harrop, Kreativdirektor Fork: Uns wundert die Formulierung»nur ein Hype«, denn unsere Branche basiert auf Hypes! Alle zwei drei Tage stoßen wir auf etwas, das verspricht,»die Welt zu verändern«, und unsere Aufgabe ist es, am Ball zu sein, Dinge auszuprobieren... kurzum, den Hype mit offenen Armen zu begrüßen. Die Erfahrung zeigt dann, welcher Stil für welches Projekt geeignet ist. Aber der Hype stößt erst mal zahlreiche Experimente an. Trent Walton, walton.com/2013/01/20/paral lax-scrolling-on-the-web: Vertikales Scrollen zu nutzen, um horizontale Bewegung auszulösen, kann sich widersprüchlich und unnatürlich anfühlen. Ähnliche Effekte, wie das Scrollen zu verlangsamen oder es zu nutzen, um Objekte zu laden oder zu animieren, kann schwerfällig und desorientierend wirken. Es gibt sicher Ausnahmen, aber man kann wohl nicht immer sagen, dass eine Site den User mit solchen Effekten stärker involviert. Ich selbst bin weniger involviert, wenn das Scrollverhalten nicht, wie man es erwartet, funktioniert oder mir gänzlich aus der Hand gleitet. Es ist wie im Auto: Sogar subtil verä nderte Reaktionen bei der Steuerung verunsichern den Fahrer und lenken ihn von dem ab, was auf ihn zukommt. campstgas brandidenllties printectrnattex 'mbhcelloes webelleaknotion dealgolor eckarata pretfy_thinga for art_&culture oreatbut_oommerre festivals1leventa oltles.8loountries soediasues about.ahoy Ohne verschwurbelte Ebenen verbindet die Site von Ahog Studios eine fixe Navigation sowie vertikales und horizontales Scrollen in einem schlichten und damit nachvollziehbaren Kreuz Har la the bog max.. hend SMliodend? Mine can» up erill merk Mem DM. beelel meyr. rte.r. Free, <Modul end lt In am, pockel They alm Iraneport erncipl. erneuer nee. nerreirl ereery booliet 1. unle. MUT Wrteeelatelm and warme. nm. erriela, new MILliedoe Mem ominr. Dmf man ema. wen Sm. Häng NIMM. solmeli Med. IM Mal Anne Mem HMMIMom eummreem: 8Pmer. HAmr. 50 dm, INM. leere LeM. Ottemicerech mml peu«in erm neeenntehe. Und...nnne ramppromn weh dre Mleale, fremde von Cremuerelem SD0OOÜm: les D.M. IM Sr WW, tmemmteek MM Men Malhon wer TaMen. Dmierbh larm man Mut etecedkede betun Blnperecentedecm - Dass ParallaxScrolling-Sites für Making-ofs von Filmen wie gemacht sind, veranschaulicht lifeofpimovie.com

6 028 Single-Page-Site mit doppeltem Boden: Bei dem von Roanne Adams für das Modemagazin»Lula«gestalteten Auftritt liegen hinter Aussparungen Fotos und Videos weiten vorzustellen ( de), für Kampagnen-Microsites (www. trifft-jeden.de ) und natürlich für Designerportfolios letztgenannte Anwendung ist in diesen Tagen am häufigsten anzutreffen. Der Schuss kann aber auch nach hinten losgehen. Etwa zu beobachten bei der Website eines Fitness-Coachs, wo die Bilder eben keine lineare Entwicklung zeigen und der Sinn der verwirrend herein- und herausfliegenden Zahlen sich erst am Ende offenbart, wenn man vermutlich bereits längst ausgestiegen ist. Mit perfektem Storytelling hingegen ist www. flashvhtml.com umgesetzt. Dort lässt die Agentur Waste aus London Flash und HTML5 mit zwei eigens dafür programmierten»waste Invaders«-Varian- ten gegeneinander antreten am Ende kann der Spieler die Version liken, die ihm besser gefiel. Bis jetzt hat HTML5 mehr Likes, doch das salomonische Fazit von Waste lautet:»beides sind nur Werkzeuge, und wir lieben ALLE unsere Werkzeuge! Bei der Technik parteisch zu sein, führt nirgendwo hin.«stimmt! Und wir fügen hinzu: Ebenso wenig zielführend ist es, bei Gestaltungstrends parteiisch zu sein. Bei jeder Aufgabe müssen die richtige Technik und die richtige Gestaltung zum Einsatz kommen in Zusammenarbeit der jeweiligen Spezialisten auf ihrem Gebiet, bis hin zu Typo, Foto und Film. Auf dass Deutschland seinen Rückstand in Sachen kreatives, anspruchsvolles, mutiges, einfallsreiches Webdesign endlich aufholt. cg Single Page reicht doch! Vom Thema Scrolling naturgemäß kaum zu trennen ist der Trend zum Single-Page-Design. Wobei viele Sites, die auf den ersten Blick so daherkommen, gar keine sind, sondern letztlich doch irgendwo wieder Links zu Unterseiten beinhalten. Statt wie bisher eine Website wie ein Buch oder ein Karteikartensystem aufzubauen, wird sie bei Single-Page-Sites quasi als eine große dynamische Leinwand verstanden. Angesagt sind derzeit Lösungen, die nur eine Scrollrichtung vorsehen, in der sie eine hoffentlich durchdachte lineare Narration entwickeln. Fallbeispiele: Single-Page-Lösungen sind perfekt für ErklänNebsites ( everylastdrop.co.uk) oder sonst wie Infografisches ( 2012), um kleine exklusive Produkt- Single-Page-Storytelling: Waste aus London lädt auf com zu einem Wettkampf zwischen Flash und HTML5 ein CornoOng SWF, n10001 that 0010 exon,ences con be thettod & 0.00,100 os es sänge hos Sen esitonef, frnpotem fee Fee ones the nature cl KIM121.5 rtmons that 1's bose ossee etre laxeof os tneveltel hes. leseg of Hitt.5 los etefoto netne nee CCletul rrenceethent istockphold Zeige WasDesignKann.de