der hess » web design

My most important Twitter Messages #12

admin — Sat, 26 Nov 2011 20:45:57 +0000

A small summary of my Twitter messages from August - November 2011:

Allgemein (General)

some nice talks http://vimeo.com/eyeofestival/videos #visual #media #art #design
insideAR 2011 talks (Augmented Reality Conference) are online
RT Our first title in the Maker Press series: DIY Bookbinding. Download the PDF book, bind it, and win a prize
startnext.de ist die Crowdfunding Plattform für deutsche Projekte in Deutschland. Link via mein Bruder Lorenz
Device Art: A New Form of Media Art from a Japanese Perspective

Generative Art:

Our lecture from the "Design the Future" series at Carnegie Mellon University is now online

Info Design and Visualization

Sense of Patterns, visualizing mobility data in public spaces (via @moritz_stefaner)
RT Great talk by @mbostock on the smooth d3 force layout | interactive slides
Linz published some local data about their area - Linz Open Data project via @mkalten
RT http://pachube.com (platform for internet of things) is now free. No excuses now not to use it!
RT If you are into big data streams, this service should get you excited: http://datasift.com/ (now if they had some nice visualizations...
Royal Society journal archive made permanently free to access.

UX and Interaction Design:

nice article about problems of gesture based interaction reminds me on my old paper
very nice: TapSense: Enhancing Finger Interaction on Touch Surfaces
Touch Vision Interface has a really nice interaction approach for augmented reality apps
Between the Tag and the Screen - A PHD Thesis by Kjetil Nordby
sweet but not cheap: International Journal of Creative #Interfaces and Computer Graphics (IJCICG)

Projekte und Experimente (Projects and experiments)

"An Urban Sensation" overlay live CCTV footage to a 3D model of the urban environment
nice project openpaths.cc by the New York Times Lab

Neue Technologie (new Technologies)

Another tool and software for 3d projection mapping http://www.madmapper.com their blog is also pretty informative
nice resource and software for 3D projection #mapping #visual #design #interactive #installation #art
Amazing! Render 3D objects into photos: Rendering Synthetic Objects into Legacy Photographs
KinectFusion - a research project that lets users generate high-quality 3-D models in real time using Kinect.
Some nice development is going on... Augmented realtiy #tracking for #mobile devices
Publication: Future Textiles

Programmierung und Software Design (Programming)

Seems to be an interesting article: Ladder Of Abstraction by Bret Victor
RT In case you want to work with maps in processing, here is your open source library: unfolding by @tillnm
RT iGeo is free and open source 3D modeling software library for processing for architecture and product design
RT Google Mapper for Processing is a library that enables you to download images of any size from Google Maps.
RT howto use svg for rigged 2D-animations in processing
RT a new HTTP Library for processing for GET,POST,oAuth and more
RT Finally a good overview of all openFrameworks addons:

Physical Computing

Nice resources and inspiration for fixing and repairing (electronic) objects via @make
Fab@home is working on a decentralized factory approach for your home
Infrared 101

Game Developing:

Very nice collection of old school Game title screens
RT Photo-realistic game engine from Square Enix
Citrus Game Engine Now Free and Open Source
Create Flash and iOS Games via Editor Stencil via @andremichelle and @jensfranke looks nice!
Construct 2 - A visual HTML5 game development tool
Very good blog about Game Design! http://www.lostgarden.com/

Flash and Flex

RT AIR Developer Center | Using Flash Builder 4.5 to package applications for Apple iOS devices
Fast and easy! The Flex 4 Spark Framework Architecture for (ui) component development by David Deraedt
Great article on #Flex 4 skin programming by @mraad . Focusing on #performance and reducing boilerplate code
Talking Trash – An overview of #Flash Player Garbage collection
RT Introducing opensource evoSpicyParticleEngine
RT Particle Editor for #Starling. Blog Post | Tool (cc @leebrimelow @thibault_imbert )
RT Check out this incredible Stage3D AGAL sandbox by @li_palebluedot - a fun way to learn AGAL shaders.
some nice generator tool for enum and value objects
That's sound cool vor enhancing your personal workflow: Creative Suite Extension Builder
Not so new but still interesting whitepaper comparing AJAX and Flex in terms of productivity and etc via flexlabs
Nice article for identifying the best web target platform. If it is Flash or HTML5

My most important Twitter Messages #10

admin — Thu, 09 Jun 2011 10:27:54 +0000

A small summary of my Twitter messages from March - June 2011:

Allgemein (General)

Very interesting documentation about media (#design): Everything is a remix
Added the talk: IDEO's Tim Brown in Conversation with Bruce Nussbaum | Parsons The New School for #Design
videos and talks of see conference are online #design and #infovis
RT gardens. amazing liquid sculptures.
This open source search engine or network does not look bad
Interesting book: Manuel DeLanda: #Philosophy and #Simulation: The Emergence of Synthetic Reason
Also a very nice plaform for #funding your projects http://www.indiegogo.com/ an alternative to http://www.kickstarter.com/
RT Kickstarter projects success vs fail analysis, stats and links/via @neilhimself
Really astonished example of stage based #animation! via @JoshuaDavis

Generative Art:

RT NODE10 - Forum for Digital Arts, Documentary
Really really enjoyed the talk of Jared Tarbell about #generative #art and how #code goes beyond the desktop
very cool website for generative and genetic algorithms... Would like to read the book
Computer #Art and #Typography, check Travis Kirtons work | paper | and his master thesis

Info Design and Visualization

RT I am quite impressed with think quarterly magazine design and branding. Content looks good, too (via @shervinafshar)
Yay, my talk from last year's decoded conference is online: "Lasst die Daten sprechen" (German)
great project about visualizing choreographic structure from dance to data objects

UX and Interaction Design:

RT Q&A: How to Make TV Apps Work (via @pickone)
Es wäre interessant die Disziplin Psychotechnik wieder fürs #Interaction #Design aufzuarbeiten
Found a nice paper Psychophysiology as a Tool for HCI Research: Promises and Pitfalls
This #paper sounds also very interesting: Evaluation of User Interfaces for #mobile app #development environments
RT Ultimate Collection of Mobile User Interface Patterns: (via @pickone)
RT Must Read: @preciousforever: precious presents: Patterns for Multiscreen Strategies
Great article by @grigs: Where are the Mobile First Responsive Web Designs?
Golden Rules for Bad User Interfaces via @timperrett
It's a pretty old article but still interesting to read: A History of the GUI
RT Great collection: The Buxton Collection (via @BogieZero, @stefanwoelwer)
Nice conference and resource for Sonic #Interaction #Design and their proceedings
Nice to read: The Theory Behind Social Interaction Design

Projekte und Experimente (Projects and experiments)

RT Great project: Kater - Tangible robots for multitouch tables (via @tillnm)
Extending the Touchscreen - #device control development | blog
Nice project for information #visualization on #architecture and #urban #spaces

Neue Technologie (new Technologies)

Researchers have discovered a universal property of musical scales.
a state-of-the art report: Augmented Reality for Smartphones
Nice mind map about augmented reality development
TLD is a real-time algorithm for #tracking of unknown objects | source
MotionBeam project - Non-Flat #Displays for #mobile devices| paper

Programmierung und Software Design (Programming)

RT Initial impressions of Amazon Cloud Drive / Player good start, TONs of promise, needs some polish
OpenPlug Studio now Free-for-All #developers #mobile | article
RT IgnoCodeLib a new library to export Adobe Illustrator Files AI7 directly from processing
PSmile - Smile Detection library for #Processing by Bryan Chung via @CedricKiefer but it seems only for Mac OSX...
#OpenGL library for #processing ->GLGraphics
Tutorial: Using JavaDB from #Processing
RT Great starting point for toxiclibs: #processing
Working with #Toxiclibs - #Processing tutorial by Amnon Owed | CreativeApplications.Net
Another great tutorial about using eclipse for processing
Building Interactive Installations with OpenCV - #processing
RT Processing Tools "InitSketch" got updates to work with processing 1.5
RT in addition to the InitSketch processing tool, there was just released a SaveTemplate Tool
RT source for serial comms over audio used on @imogenheap twitter dress
Ruby meets creative coding http://www.zajal.cc/ (via @rdrb)

Physical Computing

Interesting system for programming your spatial home
RT Meet the IOIO for Android - USB access to your Android-based phone
Interesting #DIY 3d Printer project
An easy to use alternative to arduino
very interesting article about #arduino and #android | google video presentation
nice article: Using #Android ADK with a standard #Arduino Uno and USB Host Shield
Make: Projects is a living library for makers, nice place for getting inspiration

Game Developing:

RT Excellent active tuts article on Euclidean Vectors in AS3 by @DanielSidhion
RT Learn about #Flash virtual game controllers for touch-based devices w/ this #article from @FlashGen
quickb2 simplifies the usage of box2d physic library | tutorial
RT Gaming Developer Center | Rendering animated models in mobile games
Introduction for Pushbutton Engine
Electrotank Universe Platform (EUP) is an interesting #game #server environment for Social MMO games
Game Closure launches HTML5-based cross-platform game technology
RT gSkinner: This is awesome! A very robust RPG game engine built on top of EaselJS
The Art of Video Game Title Screens
New version of Level Editor DAME 2 available | a review

Flash and Flex

RT gSkinner: Finally got around to adding a few more items to my AS3Libs Github repo. Nearly done
RT “@github_as3: as3-utils - reusable package-level functions that solve common problems” quite handy stuff!
cocoon-p2p: a library for #ActionScript focussed on local IP multicast (create #iOS remote controls)
RT That might come useful sometime - Sending Bluetooth commands via AIR using native process
BabelFX is a #localizing framework for #Flash & #Flex apps | article
RT Looks interesting for #Flex #Java #Enterprise apps, the Athena framework. Session/EntityManager for Client Side #ORM
RT Interactive Lab is proud to release open-source an essential part of our multi-touch framework - #as3 #tuio #osc parser
RT Flex Developer Center | Introducing Adobe Flex 4.5 SDK
Good preso on #Flex #performance with the new 4.5 SDK #skinning
RT Flex Developer Center | Flex mobile skins – Part 1: Optimized skinning basics
RT Incorporate #GPS in your #mobile #app with this #Adobe #Flex 4.5 #SDK walkthrough tutorial:
RT Article about persistant data when developing #mobile apps with #Flex 4.5
A very nice #tutorial series about item renderers for #Flex 4.5 mobile devices
RT Flash Builder Developer Center | ActionScript Code Coverage Plug-in for Flash Builder
RT Kudos to ZaaLabs for ZaaIL the super-useful alchemy port of DevIL
RT @flashforum: FlashFirebug: A Firefox extension that allows developers to debug AS3 flash files
ActionScript 3.0 Communication in Parallel Programming
RT Moonshine (AS3 IDE in AIR) (via @elsassph)
using the #Photoshop #Touch SDK with #AS3
RT Media Measurement in Flash Player 10.3

Book Review: The Elements of User Experience

admin — Fri, 31 Jul 2009 08:25:29 +0000

The Elements of User Experience von Jesse James Garret ist mit einem Erscheinungsjahr von 2003 ein bissl in die Jahre gekommen, dennoch verliert es meiner Meinung nach nicht an Bedeutung. Mit seinem 5 definierten Basiselementen der User Experience für webbasierte Medien hat es Jesse James Garrett sehr gut geschafft alle Disziplinen, die in den interaktiven Entwicklungsprozess involviert sind zu vereinen. Dabei betrachtet er die 5 Basiselemente immer wieder unter 2 verschiedenen Gesichtspunkten (englische Version). Einmal aus Web-Applikation-Perspektive (heute würde man Rich-Internet-Applications dazu sagen) und einmal aus Hypertext-Perspektive (Informationsdienste, wie z.B. Wikipedia). Diese unterschiedliche Betrachtung, finde ich unter heutiger technischer Entwicklung nicht mehr so zeitgemäß, da aber so viele Gemeinsamkeiten zwischen diesen beiden Betrachtungsweisen existieren, ist dies wirklich kein großes Problem das Passende daraus zu extrahieren.

Zudem liefert das Buch eine gute Step-by-Step Anleitung für interaktive Webprodukte, welche Disziplinen (z.B. Interaction Design, Information Architecture, Interface Design usw.) benötigt werden, welche Aufgabe diese verschiedenen Disziplinen haben und wie sie miteinander interagieren müssen.

Aufgrund der einfachen und verständlichen Schreibweise und das Definieren elementarer Grundlagen für eine passende User Experience im Web auf ca. 175 Seiten ist dieses kompakte Buch meiner Meinung nach ein absolutes Must-Read (genauso wie Don’t make me think von Steve Krug) für alle Web/Flash Developer und Designer, Projektmanager und Marketingbeauftragte im Online Sektor. Wer Angst vor den englischen Texten hat, dem kann ich Entwarnung geben. Es ist wirklich sehr einfach geschrieben, so dass das Schulenglisch für dieses Buch sehr gut ausreicht, auch die Grafiken im Buch unterstützen das Verständnis der Texte sehr.

Dieses Buch empfehle ich nicht etablierten Interaction Designer oder Interface Designer, da es sich nur mit der Oberfläche im Bereich User Experience im Web befasst und als Zielgruppe eher Anfänger im Bereich Interaction Design, User Experience anspricht.

The Elements of User Experience von Jesse James Garret

Wer sich für weitere Bücher im Bereich User Experience interessiert, kann gerne mal in meinem Bookstore im Bereich Human-Computer Interaction weitere passende Bücher anschauen, vielleicht ist auch noch etwas bei den Zeitschriften dabei...

Magazine für den Digital Media Producer

admin — Mon, 12 Mar 2007 12:33:58 +0000

Im Rahmen meiner Fachschaftstätigkeit wurde ich beauftragt eine Liste von Zeitschriften zu erstellen, die den kompletten Anwendungsbereich eines Medieninformatiker und Online Medianer abdeckt. Da diese Auflistung für den ein oder anderen interessant sein könnte, möchte ich sie keinen vorenthalten. Für den Bereich Werbung, Design, Animation und Post Production gehen an den Start die deutschen Zeitschriften Digital Production (hauptsächlich 3D und Post Production) und die PAGE (Werbung, Design und ein bissl Medienproduktion). Aus dem englischen Raum kommen die nicht ganz so billigen Zeitschriften Computer Arts Project, Computer Arts und 3D World in Frage. Den fließenden Übergang vom designlastigen zum programmierlastigen bildet das deutsche RIA und Multimedia Entwicklungsmag Visual X, das sich stark mit der grafischen (Web)Programmierung beschäftigt. Nun wo wir jetzt beim Programmieren angelangt sind gibt es einige sehr gute technologiebasierte Mags, deren Titel so aussagekräftig sind, dass sie keine nähere Erläuterung benötigen.

Entwickler Magazin (Allgemein und Webentwicklung)
Java Magazin (Java Frameworks und Web-Anwendungen)
Eclipse Magazin (unter anderem PlugIn Programmierung)
XML & Webservice Magazin
PHP Magazin
Internet Professional (Allgemeines zum Web)

Und zu guter Letzt für die Game Developer unter uns das amerikanische Game Developer Magazine, das den Wissensdurst rund um die Spiele Entwicklung ein bissl stillen sollte.
Wem das noch nicht genug ist und sich noch ein bissl Insparation holen will (oder um einfach von dem fachspezifischen Gedankengut mal wegzukommen), sollte sich hin und wieder einige Magazine, wie z.B. die Art (für Design), den Kameramann und die Schnitt für den Filmbereich oder Brand eins (fürs Management), zu Gemüte führen.

Ich denke die erwähnten Magazine decken den Digitalen Medien Markt bis auf den Mobilen Bereich ziemlich gut ab. Leider kenne ich mich im mobilen Bereich nicht sehr gut aus und habe somit leider kein brauchbares Magazine für den Mobile Developer gefunden. Falls einer von euch ein gutes Mag kennt, bitte schreibt mich an. Ich bin für jeden Tipp dankbar. Vielen Dank!

-- UPDATE 22.07.2007 --
Neulich bei meinem Streifzug bin ich über zwei neue Zeitschriften gestossen, die für den Media Producer sehr interessant sind. Die Zeitschrift Medienwirtschaft für Managementthemen in den Medien und die Zeitschrift Form f¨r den Designbereich.

-- UPDATE 2.06.2008 --
Mir sind zwei weitere Zeitschriften über den Weg gelaufen, die in Sachen Interaktion sehr interessant sein könnten:
Make Magazine
ACM Interaction

Täglich Brot des Web-Developers

admin — Tue, 20 Feb 2007 12:21:48 +0000

Mittlerweile werden die Anforderungen an einem Web-Developer immer höher. Denn bei dem einen Auftrag soll etwas für den Endkunde erstellt werden und das andere Mal eine aufwendige Web-Anwendung. Öfters muss man dann schon mal gelöste Probleme bearbeiten, die man aber vorher nicht ganz so gut auf Wiederverwendbarkeit optimiert hat. Und genau an diesem Punkt ist bei mir persönlich der Frust am grössten. Warum soll man sich nochmal mit schon gelösten Problem rumschlagen, fast totale Zeitverschwendung. Aber zum Glück gibt es ehrgeizige und nette Leute da draussen im Web, die sich an die Befriedigung der unterschiedlichsten Bedürfnisse der Web-Developer heran gewagt haben. Herausgekommen sind einige Web-Libraries zu den verschiedensten Web-Technlogien (wie z.B. JavaScript, PHP usw.). Auf cameronolthuis.com gibt es eine sehr gute Aufzählung der TOP 10 Web-Libraries (dazu gehören z.B. die PHP PEAR Library, Moo.fx, Dynamic Drive CSS Library usw.), der ich nichts mehr hinzufügen kann, ausser der Ajax Framework Übersicht von ajax-info.de. Persönlich denke ich, wird sich eine Einarbeitung in die diversen Web-Frameworks auf lange Sicht auf jeden Fall lohnen, da diese den technischen Produktionsablauf erheblich unterstützen können. Auch wenn es Anfangs durch den Mehraufwand (Einarbeitung in das Framework) nicht sofort erkennbar wird.
Allerdings sollte man noch die Nutzungsbedingungen der Frameworks sehr gut kennen um nicht im Nachhinein teure Strafen für Nutzungsverstösse zahlen zu müssen. (Und es wäre auch noch sehr schade um die investierte Zeit für die Einarbeitung).

Für kleinere Probleme benötige man jedoch keine großen Web-Frameworks, sondern nur eine Plattform, die einem schnell die gesuchte Information anbietet oder einem einfach nur an die gewünschte Information im Web weiterleitet. Eine mögliche Hilfestellung dafür bietet die gotapi.com Seite. Das Team von gotapi.com hat sich zum Ziel gesetzt, soviele Dokumentation von Web-Frameworks auf ihr Seite zu vereinen wie möglich. Herausgekommen ist ein Monsternachschlagewerk für Web-Frameworks. Wird man in den Dokumentationen nicht fündig und die Suche nach den kleinen Kniffen geht weiter, dann kann ich euch das webbasierte Webdeveloper Handbook 2.0 von alvit.de empfehlen. Eine super Linkliste mit den besten Blogs und Portalen zum Thema Web-Development. Ich denke mit diesen 2 Links kommt auf jeden Fall bei der Lösungssuche weiter.

Das Design spielt auch bei uns Web-Developer eine nicht unwichtige Rolle und da ich mir persönlich nach dem Programmieren damit manchmal ein bissl schwer tue, haben sich bei mir 3 Web-Tools als Hilfestellung bewährt. Zum Einen verwende ich für das Abstimmen der Website Farben den ColorBlender als Inspirationshilfe. Denn der ColorBlender kann aus vorgebenen Farben eine 6farbige Farbpalette generieren, die sich dann auch noch in Photoshop oder als HTML Code exportieren lassen. Ein super Tool für die harmonische Farbgestaltung einer Website.
Das Typografie Problem im Web umgehe ich meistens mit den Typetester Tool von Marco Dugonjic. Bei diesem Tool kann man die meist genutzten Fonts im Web mit Hilfe von DropDown-Menüs formatieren. Diese Formatierungseinstellungen werden dann in verschiedenen Kombinationen angezeigt. Ist das gewünschte Ergebnis erreicht, können diese Font-Einstellungen als CSS-Code abgespeichert werden und für die eigene Website verwendet werden.
Zum Überprüfen von Website-Layouts verwende ich unter anderem das Tool Feng Gui (danke an Kjell für den Tipp!). Dieses Tool analysiert das Website-Layout nach Hotpoints unserer visuellen Aufmerksamkeit. Als Orientierungshilfe in Sachen Layout ist das Ergebnis sehr hilfreich.

Ich denke das reicht fasst aus als tägliches Brot eines Web Developers, die Leckereien gibt es ein anderes Mal

-- UPDATE 7.06.2007 --
Ein nettes CSS Framework mit dem Kürzel YAMLsoll den Web-Designer beim Erstellen von mehrspaltigen Layouts unterstützen. Desweiteren gibt es auch schon Erweiterungen für die CMS-Systeme TYPO 3, Joomla, Papoo CMS usw., auch die Blogengine WordPress sowie die OnlineShopEngine xt-Commerce unterstützen YAML

-- UPDATE 24.05.2008 --
Eine nette Auflistung von 30 Websiten, die man als Web Developer kennen sollte.