Photoshop Experimente
Um sich in Programmen wie Photoshop immer wieder weiter zu entwickeln, bieten diverse Tutorial-Webseiten im Netz genügend Material. Ein schönes Tutorial hat zum obigen Bild geführt. Das Originalbild von Janine könnt ihr auf flickr sehen. Das erwähnte Tutorial eigent sich insbesondere, um sich mal mit den verschiedenen Füllmethoden vertraut zu machen und für einige Kniffe mit [...]

iPhone Prototyping mit PowerPoint
In einem früheren Beitrag (1) habe ich mich mit Adobe Flex als Prototyping Tool für das iPhone beschäftigt. In meinen Augen ist Flex ein geeignetes Werkzeug, um einen relativ fortgeschrittenen Prototyp zu bauen. In der Anfangsphase des Entwurfs einer App fürs iPhone wirkt es wahrscheinlich zu aufwendig. PowerPoint bietet sich dagegen für frühere Phasen des Entwicklungsprozesses [...]

ClickTale Heatmaps – Verstehen des Scroll-Verhaltens von Nutzern
ClickTale ist ein Tool, mit dem Ihr das Verhalten von Webseitenbesuchern beobachten könnt, um dadurch Hinweise auf die Usability Eures Blogs zu erhalten. Interessant sind bespielsweise sogenannte Heatmaps, die anzeigen, welche Bereich der Webseite stärker und welche Bereiche weniger stark frequentiert werden. Das obige Bild zeigt ein Beispiel für eine Scroll-Heatmap, die das Scrollverhalten der [...]

On the Grid – Wireframes einfacher erstellen mit dem 960 Grid System
960 ist ein Gitter-Framework zur Erstellung von Wireframes, Prototypen und Webseiten. Es gibt Templates für verschiedene Wireframe Tools wie Fireworks, Photoshop, Visio, OmniGraffle und mehr. Vorteilhaft ist insbesondere, dass ebenfalls entsprechende CSS Stylesheets zur Verfügung stehen, mit denen Ihr Euren Konzept nach der Entwurfsphase leichter umsetzen könnt. Auch in der Drupal Community findet 960 [...]

Individueller Image Slider mit ActionScript 3 Tweening Class
Mit der ActionScript-Klasse Tweener könnt Ihr sehr schöne Tweens und Transitions in Flash bzw. Flex erstellen. Einfach entsprechende Datei runterladen (z.B. SWC) und im as3-Teil über import caurina.transitions.*; verfügbar machen. Image Slider Im Beispiel oben besteht der “Slider” lediglich aus einem Bild, wie im Folgenden als MXML Code zu sehen: <mx:Image id="imgDragger" x="0" y="0" source="{dragger}" mouseDown="startMove(event);" mouseUp="stopMove(event);" buttonMode="true" useHandCursor="true" [...]