Zollfreiheit mit Liquid Layouts

Die Spanne verfügbarer Monitormaße ist heute größer denn je. René Schulze beschreibt in der WEAVE 05.2010, wie Sie ein Webdesign anlegen, dass alle Größen elegant berücksichtigt. Die Arbeitsdateien zum Tutorial finden Sie hier:

Arbeitsdateien herunter laden

WEAVE #6 ist da: Ab 19. Juli gibt es das Magazin als Abo oder in allen gut sortierten Bahnhofs-Kiosken

FEED

Wissenswertes kurz und knapp »Universe of Particles«: Sphärische Interfaces im Genfer CERN // Mal- und Zeichen-Apps fürs iPhone & iPad // Das Web als Experimentierfeld: Pay with a Tweet // iPad-Gadgets: Taschen, Cases, Stifte & Co // Gründerzeit: Venture-Kapitalist Sarik Weber im Interview // Chronik: Wissenswertes und Kurioses aus zwei Monaten // Projekte aus Lehre und Forschung // Terminkalender // Zehnjähriges: Die OFFF // Webbasierte TV-Apps: Sechs Usability-Tipps

TRENDS

Social-Media-Usability Wie lauten die zehn wichtigsten Usability-Regeln für eine aktive Netzgemeinschaft? Tim Bosenick unterzog die einschlägigen Adressen einem Experience-Check-up

Location-Based Services Standortbezogene Dienste sind der nächste große Trend nach Twitter. Sven Wiesner zeigt, wie Agenturen und Unternehmen ihn für virales Marketing und Kundenbindung nutzen >>>Linkliste

Workflow im Wandel Generatives Design erfordert eigene Arbeitsabläufe und Kooperationsformen. Eine Positionsbestimmung mit Agentur- und Projektbeispielen von Patrik de Jong

PROJECTS

App-Publishing für Verlage Für viele Verlage ist das iPad ein Heilsbringer – doch wie den neuen Kanal in den Workflow einbinden? Die Agentur Datenwerk entwickelte dazu ein hybrides App-Konzept, mit dem Verlage diverse mobile Plattformen über bestehende Content-Management-Systeme bespielen können. Mit einem Tutorial von Developer Ivo Heckmann

AIR-Desktop-App Eine Anwendung, die komplexe ökonomische Entscheidungen unterstützt und dennoch schick ist? Diese knifflige Aufgabe konnte die Agentur reppa.net nur in besonderer Teamarbeit mit dem Kunden lösen. Inhaber Thomas Reppa gibt zudem Tipps zu AIR und der richtigen Implementierung von Frameworks

TUTORIALS

Open Source Media Framework Adobes OSMF erleichtert die Auslieferung von Video, Audio und Advertising. Florian Plag erklärt die Implementierung und gibt einen Überblick über die wichtigsten OSMF-Klassen >>>Linkliste

Virale iPhone-Apps Die Integration sozialer Plattformen macht Apps attraktiv und hilft bei der Verbreitung. Tilman Reiff zeigt, wie Sie Twitter, Facebook und E-Mail in Ihre iPhone-App einbinden

Liquid Layouts Ein Screendesign und eine Web-Typo, die so flexibel sind, dass sie in allen Monitorformaten gut aussehen? Webdesigner René Schulze zeigt, wie das geht

HTML5 Storage API Mit HTML5 kann man Daten zumindest teilweise auf den Client auslagern. Daniel Mies zeigt anhand verschiebbarer Browser-Post-its, wie sich das Feature sinnvoll nutzen lässt

TOOLS

B2C-Teaser Social-Media, Video, Augmented Reality, ortsbasierte Dienste und Co: Florian Schneider stellt die verlockendsten E-Commerce-Zugänge vor

App-Vermarktung Der App-Markt boomt, und viele träumen vom großen Coup. Doch Erfolg gibt’s nur mit der richtigen Strategie. Start-up-Gründer Wolf Becvar gibt Tipps für die Beta- und Release-Phase

Apple versus Google Steve Jobs regiert – wollen wir das? Simon Widjaja kommentiert

Lektüre Flash-Bewegtbild, Freelance Webdesign, digitaler Aktivis-mus, Prototyping mit SketchFlow und Expression Blend und ein Processing-Special

LIFE

F.A.T. Lab Seit Monaten kocht der Streit um Google Street View. F.A.T.-Lab-Medienkünstler Aram Bartholl über seine Spritzfahrt im Dienste des Datenschutzes und deutsche Eigenheiten

Porträt: Barrierefreie NUIs Tom Smurthwaite ist Ex-Hippie, Singer-Songwriter und Co-Gründer des Social Enterprise Decoda. Dort entwickelt er interaktive Installationen für Menschen mit Behinderung

Sci-Fi-Interfaces Von »Star Trek« bis »Minority Report« – vieles von dem, was einst Fiktion war, ist heute Realität. Designer Thomas Gläser vergleicht, hinterfragt und kommentiert. Im Interview: Film-, Faux- und Fantasy-UI-Designer Mark Coleran >>>Linkliste

Web-2.0-Notfallplan Ein Entnetzungs-Essay von Göran Hielscher

Contributors: 1// Sven Wiesner, Social-Media-Berater, www.webzweipunktnull.de 2// Tim Bosenick, Geschäftsführer von SirValUse Consulting GmbH, www.sirvaluse.de 3// Tilman Reiff, Interaktionsdesigner und Medienkünstler, www.brauchbarkeit.de 4// René Schulze, Webdesigner, www.rene-schulze.info 5// Patrik de Jong, Gestalter, www.artificialduck.net 6// Benjamin Rabe, Webdesigner, www.nonuts.de 7// Wolf Dieter Becvar, Projektmanagement & Konzeption, www.hotgloo.com 8// Christian Behrendt & Leif Abraham, Konzeptioner, www.innovativethunder.com 9// Peter Sunde, Gründer von flattr, www.brokep.com 10// Thomas Reppa, Entwickler, www.reppa.net 11// Cedric Kiefer, Designer, www.dec32.de

Location Based…was bitte?

Was auf den ersten Blick scheint wie der Alptraum jeden Datenschutzbeauftragten, ist der neuste große Trend nach Twitter. Sven Wiesner beleuchtet das Phänomen Location Based Services und zeigt zaghafte Versuche, den Hype zu kommerzialisieren. Dazu seine Linktipps:

Facebook Location Feature von Zuckerberg in London offiziell bestätigt!
“We are finishing designing our application soon and hope to offer it soon.”

“A Foursquare app for avoiding sausage fests”.
Dieses Foursquare Mashup alamiert wenn in der Lieblingsbar das favorisierte Geschlecht in der Überzahl ist.

Manche Menschen möchte man einfach nicht treffen.
Avoidr markiert Foursquare-Freunde und hilft alamiert den Nutzer wo sich diese Störenfriede gerade aufhalten.

Der TV Sender History Channel ist ein echter Social Media Riese und nutzt Foursquare, um den Nutzern historische Orte näher zu bringen.
vimeo.com/12925333
foursquare.com/historychannel

Frisches Geld für Foursquare
Foursquare-Gründer Dennis Crowley holt sich bei einer Investorengruppe eine dicke Geldspritze.

Twitter startet “Places” Feature für Tweets, inklusive Foursquare Integration.
blog.twitter.com/2010/06/twitter-places-more-context-for-your.html

Topguest ist ein LBS Mashup dass es ermöglicht, gleichzeitig bei den Services Brightkite, Gowalla, Foursquare, Twitter, Google Latitude, Yelp und Loopt einzuchecken. Zusätzlich soll es ein eigenes Belohnungssystem geben.

Check.in ist ein weiteres Multi-Checkin-Tool und besonders einfach zu bedienen.
Leider geht dadurch so manches Feature der Dienste verloren.

Dieses clevere Foursquare-Mashup ermöglicht es zu überprüfen, bei welchen Location man kurz davor steht den Mayor Status zu erreichen.
whenwillibemayor.com/

Endlich ist die offizielle Foursquare App für Blackberry Smartphones sowie dem Palm Pre (Public Beta) draußen!
foursquare.com/blackberry/
developer.palm.com/webChannel/index.php?packageid=com.foursquare.foursquare

Ein Hauch von Hollywood

Science-Fiction-Filme zeigen Visionen und deren Auswirkungen auf unsere Gesellschaft. Interfaces und Interaktionen spielen dabei eine wichtige Rolle. Thomas Gläser von envis precisely (www.envis-precisely.com) beschreibt in der WEAVE 04.2010, wie aus Fiktionen Fakten wurden – und wie Forschungen die Fiktion inspirierten. Dazu seine Linkstipps:

Filmausschnitte mit HCI-Bezug

Ein Live-Mitschnitt des Vortrages „Human Computer Interaction in SciFi Movie“
von Michael Schmitz, Christoph Endres, Andreas Butz (2007)
Teil 1// www.youtube.com/watch?v=SZBaOgmoe5U
Teil 2// www.youtube.com/watch?v=bXEIRs4SF9Q
Teil 3// www.youtube.com/watch?v=uBebnb0HMaU

Wargames: ein Beispiel für das User Interface Design der 1980er Jahre
www.youtube.com/watch?v=NHWjlCaIrQo

Quantum of Solace: Szene mit dem großen Touchterminal
www.youtube.com/watch?v=05f7t5xeWlA

Der legendäre Sci-Fi-Film »Tron« prägte visuelle Welten (1982)
Verfolgungsszene// www.youtube.com/watch?v=-3ODe9mqoDE
Turmwächter// www.youtube.com/watch?v=iIiP32m8tlY
Disc-Spiel// www.youtube.com/watch?v=IEU5Mk_pmlE

Trailer von »Tron Legacy«
www.youtube.com/watch?v=nxdtVWvfFSU

Hacking Hollywood, über die Spracherkennung in Star Trek Enterprise
www.youtube.com/watch?v=Nwu-5aVCCeE

Minority Report, der Klassiker für gestengesteuerte, holographische User Interface schlechthin (2001)
www.youtube.com/watch?v=NwVBzx0LMNQ

Minority Report, Lösung zum Kaufen
oblong.com

Minority Report – und ähnliche Konzepte
lukew.com/ff/entry.asp?104

Interface-Beispiele aus »Iron Man«
Drehregler Interface// www.youtube.com/watch?v=xujHshQqjMs
Holo-Terminal// www.youtube.com/watch?v=rjfUNiNj4Ak
Keyboard// www.youtube.com/watch?v=oEzo9YWxPGE
Holographic Display// www.youtube.com/watch?v=SGaLQrIBTiw
Desktop Interface 1// www.youtube.com/watch?v=_E7iJuRaDw4
Desktop Interface 2// www.youtube.com/watch?v=PcglbwmqPOc
Head-Up// gizmodo.com/377412/iron-mans-first-flight-shows-jet+like-hud-every-boys-fantasy

Interfaces aus »Iron Man 2«
www.inventinginteractive.com/2010/05/07/iron-man-2

Die legendären Gadgets es Raumschiff Enterprise
Library Computer// memory-alpha.org/wiki/LCARS
PADD// memory-alpha.org/wiki/PADD

Unternehmen, die Hollywood-Visionen visualisieren

oooii (ehemals Blackbox Digital)Unter anderem zuständig für die Umsetzung der Sets in »Star Trek«, »Die Insel« oder »Minority Report«
www.ooo-ii.com

Ein Bericht über Making of in Star Trek gibt’s unter
www.youtube.com/watch?v=nZftwcCzYyc

Double Negative
Verantwortlich unter anderem für die Visual FX in »Iron Man 2« oder »James Bond – Ein Quantum Trost«
www.dneg.com

Useful Companies
Zuständig unter anderem für die Visual FX in » Blade 2«, »Tomb Raider« oder »Bourne Trilogie«
useful.co.uk

Digital Domain
Realisierte unter anderem für die Visual FX in »I-Robot«, »Transformers«, »Time Machine«, »Star Trek« sowie »X-Men«
www.digitaldomain.com

Ein Demo-Reel findet man unter:
www.youtube.com/watch?v=VR1-OyQLQhg

Industrial Light & Magic
Unter anderem verantwortlich für die Visual FX von »Avatar«, »Star Wars – Episode 3« oder »Zurück in die Zukunft«
www.ilm.com

Weta Digital
Setzte die Visual FX für »Avatar«, »District 9«, »I-Robot« und »X-Men« um
www.wetafx.co.nz

Neil Huxley
Ein Interview mit Art Director von »Avatar«
www.inventinginteractive.com/2010/03/11/interview-neil-huxley-avatar/

Simon Staines
Art Director bei »Mission Impossible«, »Bourne Trilogie«, »Hackers«, »Planet der Affen« und vielen mehr
www.imdb.com/name/nm0821585

Marc Coleran
>>> In der WEAVE 04.2010 gibt es ein Interview mit dem Visual Designer.  Die besten seiner fiktiven User Interfaces aus Hollywood-Filmen der letzten neun Jahre Showreel 2008
vimeo.com/1563485
Marc Coleran Showreel 2006
vimeo.com/1797025

Filmliste für interactive Designer & Developer

Thomas Gläser hat zudem Tipps für den nächsten Filmabend aus Sicht eines Interaction Designers chronologisch zusammen gefasst. Er wünscht: Viel Spaß beim Durchstöbern und Ansehen.

Bis 1960

Die Reise zum Mond
OT: Le Voyage dans la Lune, 1902, Frankreich, Regie: Georges Mlis

Metropolis
1927, Germany, Regisseur Fritz Lang

Alarm im Weltraum
OT: Forbidden Planet, 1956, USA, Regie: Fred M. Wilcox

Raumpatrouille Orion (TV-Serie)
1956, West-Deutschland, Regie: Rolf Honold

1960 – 1980

Colossus
OT: Colossus – The Forbin Project, 1970, USA, Regie: J. Sargent

Andromeda – Tödlicher Staub aus dem Weltall
OT: The Andromeda Strain, 1971, USA, Regie: Robert Wise

Dark Star
1974, USA, Regie: John Carpenter

Zardoz
1974, Irland/UK, Regie: John Boorman

Mondbasis Alpha 1 (TV-Serie)
OT: Space 1999, 1975-77, UK, Idee: Gerry & Sylvia Anderson

Logan’s Run – Flucht ins 23. Jahrhundert
1976, USA, Regie: Michael Anderson

Krieg der Sterne
OT: Star Wars, 1977, USA, Regie: George Lucas

2001 – Odyssee im Weltraum
OT: 2001 – A Space Odyssey, 1978, USA, Regie: Stanley Kubrick

Kampfstern Galactica
OT: Battlestar Galactica, 1978, USA, Idee: Glen A. Larson

1980 – 1990

Per Anhalter durch die Galaxis
OT: The Hitchhiker’s Guide to the Galaxy, 1981, UK, Regie: Alan Bell

Blade Runner
1982, USA, Regie: Ridley Scott

Tron
1982, USA, Regie: Steven Lisberger

Wargames – Kriegsspiele
1983, USA, Regie: John Badham

Projekt Brainstorm
1983, USA, Regie: Douglas Trumbull

Star Trek IV: Zurück in die Gegenwart
OT: Star Trek IV: The Voyage Home, 1986, USA, Regie: Leonard Nimoy

Raumschiff Enterprise: Das nächste Jahrhundert (TV-Serie)
OT: Star Trek – The Next Generation (TNG), 1987-94, USA, Idee: Gene Roddenberry

Zurück in die Zukunft II
OT: Back to the Future II, 1989, USA, Regie: Robert Zerneckis

1990 – 2000

Total Recall
1990, USA, Regie: Paul Verhoeven

Bis ans Ende der Welt
OT: Until the End of the World, 1991, Deutschland/Australien, Regie: Wim Wenders

Demolition Man
1993, USA, Regie: Marco Brambilla

Vernetzt – Johnny Mnemonic
OT: Johnny Mnemonic, 1995, USA/Kanada, Regie: Robert Longo

Das Netz
OT: The Net, 1995, USA, Regie: Irwin Winkler

Hackers – Im Netz des FBI
1995, USA, Regie: Iain Softley

Mission: Impossible
1996, USA, Regie: Brian de Palma

Alien – Die Wiedergeburt
OT: Alien – Resurection, 1997, USA, Regie: Jean-Perre Jeunet

Gattaca
1997, USA, Regie: Andrew Niccol

Das fünfte Element
OT: The Fifth Element/Le Cinquiéme Élément, 1997, Frankreich, Regie: Luc Besson

Der Staatsfeind Nr. 1
OT: Enemy of the State, 1998, USA, Regie: Tony Scott

Futurama (TV-Serie)
1999 – 2003, seit 2007, Idee: Matt Groening & David X. Cohen

Galaxy Quest – Planlos durchs Weltall
OT: Galaxy Quest, 1999, USA, Regie: Dean Parisot

Matrix
1999, USA, Regie: Andy & Larry Wachowski

2000 – 2005

Paycheck – Die Abrechnung
OT: Paycheck, 2000, USA, Regie: John Woo

The 6th Day
2000, USA/Kanada, Regie: Roger Spottiswoode

X-Men
2000, USA, Regie: Brian Singer

Passwort – Swordfish
OT: Password, 2001, USA, Regie: D. Sena

Startup
OT: Antitrust, 2001, USA, Regie: Peter Howitt

Raumschiff Enterprise (TV-Serie)
OT: Star Trek – Enterprise, 2001-2005, USA, Idee: Rick Berman, Brannon Brage & Gene Roddenberry

Die Bourne Identität
OT: The Bourne Identity, 2002, USA/Deutschland, Regie: Doug Liman

Minority Report
2002, USA, Regie: Steven Spielberg

Star Wars: Episode II – Angriff der Klonkrieger
OT: Star Wars: Episode II – Attack of the Clones, 2002, USA, Regie: George Lucas

Time Machine
2002, USA, Regie: Simon Wells

The Matrix Reloaded
2003, USA, Regie: Andy & Larry Wachowski

I, Robot
2004, USA, Regie: Alex Proyas

2006 – 2010

Mr. & Mrs Smith
2005, USA, Regie: Doug Liman

Die Insel
OT: The Island, 2006, USA, Regie: Michael Bay

Déjà Vu – Wettlauf gegen die Zeit
2006, USA, Regie: Tony Scott

Mission: Impossible III
2006, USA, Regie: J. J. Abrams

The IT Crowd (TV-Serie)
2006-2008, UK, Idee: Graham Linehan

Das Bourne Ultimatum
2007, USA, Regie: Paul Greengrass

The Big Bang Theory (TV-Serie)
Seit 2007, USA, Idee: Chuck Lorre & Bill Prady

James Bond 007 – Ein Quantum Trost
OT: Quantum of Solace Bond, 2008, USA/UK, Regie: Marc Forster

Iron Man
2008, USA, Regie: Jon Favreau

District 9
2009, Südafrika/Neuseeland, Regie: Neill Blomkamp

Star Trek
2009, USA, Regie: J. J. Abrams

Avatar – Aufbruch nach Pandora
2009, USA, Regie: James Cameron

Caprica (TV-Serie)
Seit 2009, USA, Idee: Remi Aubuchon, Ronald D. Morre & David Eick

Tron Legacy
2010, USA, Regie: Joseph Kosinski

Hinweis: Die Liste basiert auf „Stephen Intille’s Concept Video Clip List, Resource for panel at CHI 2004 in Vienna“ und „A Survey of Human-Computer Interaction Design in Science Fiction Movies – Movie References“. Weitere Filme (alphabetisch geordnet) gibt es unter: www.berkshirepublishing.com/humancomputerinteractionandpopculture/list.asp?parCat=1

Ein Framework für alle Fälle

Mit Adobes Open Source Media Framework können ActionScript-Entwickler fast alle denkbaren multimedialen Player-Varianten leicht erstellen: von musikuntermalten Diashows über Video- und Audioplayer bis hin zu werbefinanzierten Videoplattformen im großen Stil. Florian Plag zeigt in einem Tutorial der WEAVE 04.2010 die wesentlichen Features.

Den Quellcode sowie Bild- und Filmmaterial zum Tutorial gibt’s hier: www.video-flash.de/weave

„Regierungen der industriellen Welt, Ihr müden Giganten aus Fleisch und Stahl, ich komme aus dem Cyberspace, der neuen Heimat des Geistes. Im Namen der Zukunft bitte ich Euch, Vertreter einer vergangenen Zeit: Laßt uns in Ruhe! Ihr seid bei uns nicht willkommen. Wo wir uns versammeln, besitzt Ihr keine Macht mehr“, sprach John Perry Barlow – Amerikaner, ehemaliger Viehzüchter, Songwriter und Cyberpionier – 1996 von einem Rednerpult des Weltwirtschaftsforums.

Mit dem Kampf um Internetsperren und Vorratsdatenspeicherung könnten seine Forderungen aktueller sein denn je. WEAVE traf ihn bei der TED Konferenz in Hamburg und sprach mit ihm über die „Grundrechte der User“…

Click here to view the embedded video.

Julian Koschwitz (koschwitz.org) ist Interactive Art Director und hat unter anderem das Augmented Reality (AR) Feature für das Colors Magazine realisiert (www.colorsmagazine.com). WEAVE sprach mit ihm über den abgeebbten AR-Hype, warum AR dennoch für das Colors Magazine ein wichtiges Bindeglied zwischen Print und Online ist – und über den Hype von 2010, dem iPad. Nämlich ob dieses AR-Marker nicht obsolet machen könnte…

Click here to view the embedded video.

Andreas Schimmelpfennig ist nicht nur Mitgründer der Kölner Agentur elastique (www.elastique.de), sondern auch Sound-Designer. Vielleicht mit ein Grund, warum Musik und Sound das Team oft bei ihrer Ideenfindung inspiriert. WEAVE sprach mit Andreas Schimmelpfennig über die Bedeutung und Möglichkeiten kreativer Ideenfindung – und warum Technologie dabei manchmal ein echtes Hindernis ist…

Click here to view the embedded video.

Joachim Sauter (www.joachimsauter.com) sprach bei der TED Konferenz in Hamburg über die “Renaissance of Space”. WEAVE traf ihn und sprach mit ihm über die Konsequenzen dieser Rückkehr des Analogen für Interactive Designer und Entwickler. Außerdem fragten wir ihn nach der kinetischen Licht-Installation, die er für die Expo in Shanghai entwickelt hat – und ob ihn die Expo inspiriert hat.

Click here to view the embedded video.

Brett Error ist Vice President Products and Technology bei Omniture – dem Software-Hersteller, den Adobe letzten Herbst kaufte. Nun gibt es eine erste Intergration von Funktionen der Tools SiteCatalyst und Test&Target in die Creative Suite 5. Und WEAVE sprach mit Brett Error über die neuen Funktionen, die Zukunft – und was die User der beiden Bereiche von einander lernen können.

Click here to view the embedded video.