Für das Handbuch gegen den Schmerz, durfte ich die jeweiligen Schmerzregionen illustrieren. Die Schmerzpatienten wurden von Peter Müller fotografiert. In Zusammenarbeit mit der BILD Infografik sind dann die 3D-Renderings der betroffenen Organe bzw. Körperteile entstanden. Jetzt begann der für mich spannendste Teil – die Fotos […]
Alle Artikel von “Daniel Opderbeck”

Finger Spitzen Gefühl
Es galt für eine Unternehmenspräsentation, inhaltlich unterschiedliche Begriffe zu illustrieren und diese somit durch ein einheitliches Gestaltungskonzept zu verbinden. Im Briefing viel auf das bei den textlichen Ausformulierungen unbewusst die Hände zu Hilfe genommen wurden.

Auf 10.000 Zigarettenlängen
Ich habe am Tag 20 Zigaretten geraucht. Mal etwas mehr, mal etwas weniger aber grob eine Schachtel kam fast immer zusammen. Und das über viele Jahre.

Tod reden
Unter dem Titel „Lasst uns über das Sterben reden“ entstand eine vierteilige Serie die ich wie folgt und mit viel Freude illustriert habe.

We Blog BILD
Jetzt gibt es nicht nur den BILDblog sondern auch den blogBILD! Ersterer ist wahrscheinlich den Meisten schon bekannt. Hierbei handelt es sich jedoch um einen sogenannten Corporate Blog bzw. Unternehmensblog. Wir, also die Mitarbeiter von BILD, schreiben in diesem Blog über das was wir am […]

Glaub an Dich!
Im November startete exklusiv bei BILDplus die neue Dokumentation „Joshua Kimmich – Glaub an Dich!“ (#believeinyourself). Die zehnteilige Video-Serie, produziert von BILD und UFA Lab, zeigt den Aufstieg des Bayern-Profis von seinem Heimatverein in einem Dorf bei Stuttgart zum Nationalspieler und Weltklasse-Verteidiger.

Platformer
BILD denkt in Plattformen. Dies war der Titel zur Präsentation von Julian Reichelt und Paul Ronzheimer bei den Online Marketing Rockstars 2016. Hierzu sollte eine Keynote entstehen „die mal so richtig rockt“.

Kleine Helfer No.13: Typetester
Der Typetester ist ein kleiner Helfer, den ich schon länger in meinen Bookmarks gespeichert habe. Das Tool umfasst über 2200 Schriften die live miteinander verglichen werden können. Es werden neben den sogenannten „Web Safe Fonts“ (also den typischen Systemschriften wie Arial, Verdana, etc.) auch alle Web […]

SE7EN
7 die magisch märchenhafte Zahl. 7 Berge, 7 Zwerge, 7 Weltwunder, 7 Sachen, 7 auf einen Streich, 7 Schläfer, 7 Totsünden, 7 Meilenstiefel, 7 Haupt-Chackren, 7 Bürgen und das verflixte 7. Jahr. Oder um mit der Definition von Wikipedia zu glänzen: „Die Sieben (7) ist die […]

Travelbook Croatia 2015
Hier ein paar Auszüge von meinem Reisetagebuch 2015. Die diesjährige Tour ging einmal rund herum und quer durch Istrien (Kroatien). Es hat sich zu einem entspannten Ritual entwickelt, die Eindrücke des Tages beim Kaffee zu rekapitulieren und im Skizzenbuch festzuhalten. Der Kaffee dient dabei nicht […]

Digital Caricature Drawing Tutorial
Oder: Wie man einem Freund in 20 Minuten eine Freude macht 🙂 Vor kurzem bat mich ein Freund, von Ihm eine Karikatur zu erstellen. Ungefähr zeitgleich habe ich ein Tutorial gelesen in dem es um die richtige Auswahl der Farbpalette bzw. die passenden Ebeneneinstellungen in Photoshop beim […]

CSS Only No.4: Filter Effects & Blend Modes
Die Verwendung von Filter-Effekten wie Grayscale, Contrast, Hue, Brightness oder Blur per CSS sind in der letzten Zeit immer populärer geworden. Nicht zuletzt weil Web-Designer diese Effekte aus professionellen Bildbearbeitungs – und Designtools wie Photoshop kennen und seit jeher anwenden. Auch die CSS-BlendModes (Overlay, Multiply, Screen etc.) […]

The Younify Concept
Younify ist der Arbeitstitel für einen Newsaggregator, an dem ich Anfang letzten Jahres mitgearbeitet habe. Das was diese App von anderen Aggregatoren wie Prismatic und Co. unterscheiden sollte, war gleichzeitig die Grundlage für die ersten Gestaltungsansätze. Eines der ersten Designs (und es gab wirklich jede Menge:) […]

CSS Only No.3: Cursor
Die Verwendung von unterschiedlichen Cursor-Typen macht im Webdesign an vielen Stellen Sinn. Sei es das einfache Feedback bei Formulareingaben und Karten oder nur die Verdeutlichung von verlinkten Elementen. Cursor unterstützen auf subtile Weise die Benutzbarkeit und das schnellere Erfassen von Funktionen im Web.

Kleine Helfer No.12: DummyText.com
Quasi der LoremIpsum-Generator für Webentwickler. DummyText.com bietet die Möglichkeit, automatisch Platzhaltertexte in die eigenen HTML-Templates, MockUps oder Webentwicklungsprojekte zu integrieren. Das spart viel Zeit und die Integration ist super simpel.

Artsy – Template
Artsy – ein Portfolio Theme auf Basis von Bootstrap. Bei dem Artsy-Theme habe ich weniger Anspruch auf das erstellen von vollständigen Unterseiten, Shortcodes, etc. gelegt. Vielmehr lag der Fokus auf Gestaltung, Einfachheit und Flexibilität. Rein formal handelt es sich um einen Onepager. Allerdings nicht im klassischen Sinne. Denn hier werden nicht wie […]

Echtzeitdaten No.7: Global Trend Map
Die Darstellung jeglicher Information ist untrennbar mit der Form der Visualisierung zu betrachten. Eine Menge von Daten kann auf unterschiedlichste Art und Weise dargestellt werden. Dabei gibt es sicherlich kein Richtig oder Falsch. Schließlich ist die Information die Selbe. Dennoch kann die Eine Formsprache auf den Betrachter stärker […]

EVNT BRND – Template
Wer rastet der rostet! Da beschäftige ich mich doch lieber regelmäßig mit neuen Funktionalitäten und Möglichkeiten im Webdesign. Zwar war es anfangs eigentlich nicht mein Ziel ein komplettes Template zu erstellen sondern eher das Interesse an Bootstrap, Animate CSS, Webfont Icons usw…

Facebook Instant Article
Team FOXTROT schafft ein Leuchtturmprojekt von BILD „Mach ihn! Maaach ihn! Er macht ihn!“ Mit diesen historischen Worten von Tom Bartels startete BILD.de den ersten deutschen Instant Article auf Facebook und legte damit eine Punktlandung hin. Das eigens für derartige Projekte ins Leben gerufene Team Foxtrot feiert […]

T wie Terror
Lexikon des Islamismus Erneut wartet das Storytelling-Team von BILD.de mit einer besonders gut herausgearbeiteten Darstellung von Inhalten auf. Unter dem Titel „Lexikon des Islamismus“ werden relevante Begriffe multimedial erklärt. Bei der Aufbereitung wurde wieder auf das Prinzip Full Responsive gesetzt und somit eine optimale Darstellung […]

Kleine Helfer No.11: Material Design Colors
Heute 3 kleine Helferlein für den Umgang mit Farben im Material Design. Wem dieses Designprinzip jetzt nicht unbedingt gleich was sagt, sei die Google-Introduction ans Herz gelegt. Hier findet man übrigens neben einer umfassenden Beschreibung der neuen visuellen Sprache von Google auch die komplette Farbpalette, Templates […]

Echtzeitdaten No.6: The Time in Colours
Jawohl, auch die Darstellung der Uhrzeit ist natürlich eine Visualisierung in Echtzeit. Dennoch würde ich hier in dieser Reihe wohl kaum eine Uhr vorstellen. Warum eigentlich nicht? Na vielleicht später mal. Die Nummer Sechs in der Reihe besticht jedenfalls durch ihre ebenso einfach wie geniale […]

Meinung bilden & Stimmung abgeben!
MOOD-TAGGING AUF BILD.DE Eines gleich Vorweg: Die Idee des Mood-Taggings ist natürlich nicht neu! BuzzFeed z.B. nutzt die Rubrizierung der Inhalte nach der Gemütslage seiner Leser schon länger. Und wenn man die Sicht über den Nachrichtentellerrand hinaus zulässt, sind einem vielleicht schon vor längerer Zeit […]

Car & Bike Classics
Die Webseite Car&BikeClassics.de gehört einem sehr guten Freund von mir der sich mit seiner typenoffenen KFZ-Werkstatt selbstständig gemacht hat. Neben den üblichen Arbeiten einer Autowerkstatt, fokusiert er sich stark auf die Restauration von Oldtimern (Motorräder, Sportwagen, Kleinbusse, …). Nach der Logo-Erstellung musste nun auch eine Webseite her.

CSS Only No.2: Enjoy CSS3 Generator
CSS-Generatoren zur Erstellung von Gadients, Pattern, Buttons, Shadows usw. gibt es mittlerweile viele. Ich selbst habe einige davon in der Rubrik „Kleine Helfer“ erwähnt. Enjoy CSS hingegen ist ein Code-Generator, der mich in dem Umfang seiner Möglichkeiten überrascht hat.

Echtzeitdaten No.5: The Colors of Twitter
Ein Testbild? Der QR-Code2.0? Nein! Auch hierbei handelt es sich um eine Visualisierung von Twitter-Daten in Echtzeit. „The Colors of Twitter“ ist ein Projekt von Charlie Clark, welches Tweets nach der Erwähnung von Farben untersucht und diese dann chronologisch auflistet.

Just Another OnePager
Das sich Onepager als Medium für das digitale Storytelling mittlerweile etabliert haben sollten, begründet sich allein schon durch die Schlagzahl in der sie publiziert werden. Auf BILD.de wurde erneut diese Erzählweise genutzt um den „GROSSEN PFLEGEHEIM PRÜF-REPORT“ zu realisieren. Und wie bei den vorhergehenden Online-Specials […]

Kleine Helfer No.10: BLOKK Font
Oft genug ist es mir in den frühen Phasen eines Projekts oder einfach nur bei der Visualisierung einer Gestaltungsidee passiert, das sich der Betrachter viel zu sehr in Details des Inhalts vertieft hat. Auch wenn ich hierbei immer wieder betont habe das es sich nur […]

Kleine Helfer No.9: Muster & Texturen
Heute eine Sammlung von kleinen Helfern zum Thema Muster und Texturen. Meiner Meinung nach spielen diese in der Webentwicklung seit jeher eine große Rolle. Warum? Weil sie bei geringer Datenmenge die Möglichkeit bieten das Browserfenster füllend mit einer Hintergrundoptik zu versehen!

Echtzeitdaten No.4: EmojiTracker
Der Emojitracker ist ein Experiment das die Verwendung von Emoticons auf Twitter in Echtzeit visualisert. Abgesehen davon das ich die meisten der aufgeführten Emojis noch nie gesehen habe, mag ich die reduzierte Darstellung von Informationen.