Weave » WEAVE 06.2009 http://www.weave.de Webdesign, Konzeption & Development Thu, 22 Jul 2010 08:41:32 +0000 http://wordpress.org/?v=2.9.2 en hourly 1 WEAVE 06.09 – Alternate Reality Games http://www.weave.de/linklisten/args0609 http://www.weave.de/linklisten/args0609#comments Wed, 04 Nov 2009 05:01:26 +0000 fwolf http://www.weave.de/?p=1762

Vor uns die Sintflut

Immer mehr Wissenschaftler erkennen inzwischen, dass man die Zukunft mit Hilfe des Internets spielerisch erforschen kann. In der WEAVE 06.2009 berichtet Christopher Blum über (Serious) Alternate Reality Games und adaptives Storytelling.

Hier ein paar Links zum Thema:

Eine Übersicht über aktuell laufende ARGs
http://www.argn.com/now_playing/

Was ist eigentlich ein ARG – Willkommen in der Realität!
http://www.unfiction.com/

Patmo ist die wohl populärste Plattform für ARG-Spieler, auch hier werden ARGs erklärt
http://www.patmo.de/de/was-ist-ein-alternate-reality-game

In diesem Interview erklärt Puppet Master Steve Peters die Besonderheiten des adaptiven Storytellings.
http://www.patmo.de/de/2009/01/29/15-Fragen-an-steve-peters

World Without Oil war das weltweit erste ARG – In diesem Blogartikel geht es um die Zukunft von ARGs
http://wwolives.wordpress.com/2008/07/19/the-future-of-alternate-reality-games/

Links zu den unterschiedlichen Spielen:

Superstruct

Die Spielplattform
http://www.superstructgame.org/

Homepage der Spiel-Designerin Jane McGonigal
http://www.avantgame.com/

Institute for the future über Massive Multiplayer Forecasting Games
http://www.iftf.org/node/2302

Könnte man mit Superstruckt die Welt retten?
http://venturebeat.com/2008/09/29/crowdsourcing-the-future-can-alternate-reality-game-superstruct-help-save-the-world/

Coral Cross

Das Spiel und die beteiligten Wissenschaftler
http://www.argn.com/2009/04/coral_cross_pandemic_preparedness_from_the_hawaii_department_of_health/comment-page-1/#comment-937

Wenn das Leben ein ARG imitiert: Der H1N1 Virus taucht noch vor Spielbeginn auf
http://www.argn.com/2009/05/a_second_look_at_coral_cross_when_life_imitates_arg/

Coral Cross verbreitet sich
http://www.argn.com/2009/06/coral_cross_awareness_is_spreading_/

Maddison Atkins

Die Plattform
www.maddisonatkins.com

Maddison Atkins 2.0. – Restart News
http://forums.unfiction.com/forums/viewtopic.php?t=27959&start=30

Maddison auf YouTube

Click here to view the embedded video.

Das Wiki zum Spiel
http://wiki.maddisonatkins.com/maddypedia/index.php?title=Portal:Maddison_Atkins_1.0

Year Zero

Die Band Nine Inch Nails nutzte das ARG „Year Zero“ zur Promotion ihres gleichnamigen Albums
http://www.alternaterealitybranding.com/cannes2008yearzero/

]]> http://www.weave.de/linklisten/args0609/feed 0 WEAVE 06.09 – Tutorial Webtypografie http://www.weave.de/linklisten/typotricks0609 http://www.weave.de/linklisten/typotricks0609#comments Wed, 04 Nov 2009 05:00:59 +0000 fwolf http://www.weave.de/?p=1781

Typo-Tricks

René Schulze ist Webdesigner und -entwickler und zeigt in der WEAVE 06.2009 Schritt für Schritt, wie Sie Ihre Websites typografisch verfeinern können. Im folgenden die Links zum Artikel:

Typografische Inspirationsseiten
typesites.com, typographica.org, ilovetypography.com, fontblog.de

Infos zu Typografie im Web
typografie.info, typedia.com

em-Kalkulator
riddle.pl/emcalc/

Das jQuery-Plug-in jMetronome verhindert, dass Bilder und Videos den Rhythmus Ihres Layouts zerstören
fortes.com/2008/08/jmetronome-using-jquery-to-keep-typographic-rhythm

Übersicht über die wichtigsten Zeichenreferenzen
de.selfhtml.org/html/referenz/zeichen.htm

5 Techniken, mit denen Sie frische Fonts jenseits der Systemschriften verwenden können

sIFR (Scalable Inman Flash Replacement)
mikeindustries.com/blog/sifr

Cufón
cufon.shoqolate.com

FLIR (Facelift Image Replacement)
facelift.mawhorter.net

Image Replacement
meiert.com/de/publications/articles/20050513

@font-face
webfonts.info

]]> http://www.weave.de/linklisten/typotricks0609/feed 0 WEAVE 06.09 – 3D-Flash http://www.weave.de/linklisten/holodeck0609 http://www.weave.de/linklisten/holodeck0609#comments Wed, 04 Nov 2009 05:00:52 +0000 fwolf http://www.weave.de/?p=1766

Auf zum Holodeck

3D-Welten oder -Objekte per Flash im Web bereit zu stellen, ist mehr und mehr im Kommen. In WEAVE 06.2009 berichten Kreative, was eine gute 3D-Webgestaltung ausmacht und welche Tools dafür infrage kommen. Eine Liste mit Links zu ausgewählten Website haben wir hier für Sie zusammen gestellt:

thinkingspace.economist.com
Website für das Magazin „The Econimist“, das die Denkräume von Promis und Usern darstellt – erreichbar über eine sehr ästhetische und von der Kunst inspirierte 3D-Navigation von Hi-ReS! aus London

ludoscrime.com
Schöne, sehr knallige Flash-3D-Navigation

ecodazoo.com
Wohl einer der bekanntesten Beispiele für den Einsatz von Flash-3D

www.mtl12.com
Website über Montreal, die Video und Flash-3D schön kombiniert

www.ovaldesign.com.hk
Portfolio der Hong Konger Agentur Oval Design, realisiert von pill & pillow, einer Interactive Agentur, ebenfalls aus Hong Kong. Sehr unterhaltsam und verspielt reist man hier mit einem Raumschiff zu den unterschiedlichen Angeboten der Agentur
ecodazoo.com

www.whitevoid.com
Das Portfolio der Berliner Interaction Agentur Whitevoid gehört wohl ebenfalls zu den bekannteren Anwendungsbeispielen. Schlicht und extrem bequem in der Nutzung.

www.freedomandpartners.com
Diese 3D-Navigation gehört sicherlich zu den Beispielen, bei denen fraglich ist, ob man nicht gleich bei einer 2D-Navigation hätte bleiben sollen – allerdings hat man hier die Möglichkeit, zwei unterschiedliche Ansichtsmodi auszuwählen.

www.barcinski-jeanjean.com
Dieses Agenturportfolio ist nicht nur in Flash-3D gemacht – wenn man eine 3D-Brille zur Hand hat, kann man sie auch tatsächlich dreidimensional anschauen.

www.bananacafe.com.br
Die Site für eine brasilianische Modemarke ist eigentlich sehr simpel, macht aber dennoch unheimlich viel Spaß: hier kann man in 3D über eine Zeitung navigieren und allerhand 3D-Objekte bewegen und nutzen.

www.theprofiler.be
Eine Website für einen Hosting-Anbieter, bei der man sich in seinen Facebook-Account einwählen und dort von seinen Freunden ein 3D-Profil aus Flickr-Bildern erstellen lassen kann.

www.redbullsoapboxracer.com
Nach dem Flug Tag Flightlab das zweite 3D-Game für den Getränkehersteller Red Bull von der Interactive Agentur Less Rain aus Berlin. Hier kann man sich Seifenkisten in 3D zusammen bauen, ausstatten – und natürlich Rennen fahren.

www.therelapse.com
3D-Flash-Spiel für das Plattenlabel Interscope Records

http://rampgenerator.com/index.php/generator/
Jens Christian Brynildsen gehört sicherlich zu den Flash- und Flex-Entwicklern, die am bekanntesten für ihre Erfahrungen mit Flash-3D sind – und er zeigt mit seinem neuen Ramp-Generator, dass 3D mit Flash vor allem dann sinnvoll wird, wenn man damit echte Produkte entwerfen und bauen kann – in diesem Fall Half Pipes für Skateboards…

www.klima-stadt.eu
Für den Bundesverband der Deutschen Industrie (BDI) entwickelte Scholz & Friends Interactive aus Berlin eine virtuelle Stadt, in der man Möglichkeiten des Klimaschutz erkunden kann.

www.bbc.co.uk/cbeebies/bigandsmall/fun/
Ebenfalls eines der bekanntesten Beispiele, wenn es um Flash-3D geht: eine Site der BBC zu der Sendung „Big and Small“, auf der man sich durch das Cartoon-Haus bewegen und dieses erkunden kann.

]]> http://www.weave.de/linklisten/holodeck0609/feed 0 WEAVE 06.09 – Tutorial Webtypografie http://www.weave.de/code/typotricks0609-2 http://www.weave.de/code/typotricks0609-2#comments Wed, 04 Nov 2009 05:00:51 +0000 fwolf http://www.weave.de/?p=1784

Der Quellcode zum Tutorial

René Schulze ist Webdesigner und –entwickler und zeigt in der WEAVE 06.2009 Schritt für Schritt, wie Sie Ihre Websites typografisch verfeinern können. Folgend finden Sie den Quellcode zum Durchlesen und Herunterladen:

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
  5. <head>
  6.  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  7.  
  8.  <title>Webtypografie | Weave</title>
  9.  <style type="text/css" media="screen">
  10.       /* —– Einfacher reset | Start —– */
  11.       * {
  12.                margin: 0;
  13.                padding: 0;
  14.                border: 0 none;
  15.           }
  16.       /* —– Einfacher reset | Ende —– */
  17.  
  18.  
  19.       /* —– Schriften hinzufügen | Start —– */
  20.  
  21.       @font-face {
  22.               font-family: GraublauWeb;
  23.               src: url('GraublauWeb.otf') format('truetype');
  24.           }
  25.  
  26.           @font-face {
  27.               font-family: GraublauWeb;
  28.               font-weight: bold;
  29.               src: url('GraublauWebBold.otf') format('truetype');
  30.           }
  31.           /* —– Schriften hinzufügen | Ende —– */
  32.  
  33.  
  34.           /* —– Textrhythmus und Schriftformatierung | Start —– */
  35.           body {
  36.                color: #222;
  37.                font-size: 100.1%;
  38.                font-family: GraublauWeb, 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
  39.                background: #fdfdfd;/* url('./pattern.gif');*/
  40.           }
  41.  
  42.           html > body {
  43.                font-size: 100%;
  44.           }
  45.  
  46.           p {
  47.                font-size: .875em;
  48.                line-height: 1.5em;
  49.  
  50.                margin: 1.5em 0;
  51.           }
  52.  
  53.           .marginal-note {
  54.                font-size: .75em;
  55.                line-height: 1.75em;
  56.                margin: 0 0 1.75em 0;
  57.           }
  58.  
  59.           h1 {
  60.                color: #444;
  61.                font-size: 1.313em;
  62.                text-align: center;
  63.                background: transparent url('./color-pixel-898989.gif') repeat-x scroll left center;
  64.                line-height: 1em;
  65.                margin: 1em 0 0 0;
  66.           }
  67.  
  68.           h1 a {
  69.                color: inherit;
  70.                text-decoration: none;
  71.                background: #fdfdfd;
  72.                padding: 0 .5em;
  73.           }
  74.  
  75.           h1 a:before,
  76.           h1 a:after {
  77.                color: #898989;
  78.                content: '✪';
  79.           }
  80.  
  81.           h1 a:hover:before, h1 a:focus:before,
  82.           h1 a:hover:after, h1 a:focus:after {
  83.                content: '✩';
  84.           }
  85.  
  86.           h1 a:before {
  87.                padding-right: .5em;
  88.           }
  89.  
  90.           h1 a:after {
  91.                padding-left: .5em;
  92.           }
  93.  
  94.           h2 {
  95.                color: #444;
  96.                font-size: 1em;
  97.                line-height: 1.3125em;
  98.                margin: 1.3125em 0;
  99.           }
  100.  
  101.           h2.byline {
  102.                width: 100%;
  103.                font-size: .75em;
  104.                font-weight: normal;
  105.                text-align: center;
  106.                line-height: 1.75em;
  107.                letter-spacing: .07em;
  108.                margin: 0 0 1.75em 0;
  109.           }
  110.  
  111.           .amp {
  112.                font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", "Warnock Pro", serif;
  113.            font-style: italic;
  114.            font-size: 1.1em;
  115.           }
  116.  
  117.           .caps {
  118.                font-size: .9em;
  119.                text-transform: uppercase;
  120.           }
  121.  
  122.           sup {
  123.                line-height: 1em;
  124.           }
  125.  
  126.           sub {
  127.                line-height: 1em;
  128.                vertical-align: -.3em;
  129.           }
  130.  
  131.           h2.byline + p:first-letter {
  132.                font-size: 3.281em;
  133.                margin: .06em .1em 0 -.025em;
  134.                line-height: .75em; /* Safari-Ausgleich */
  135.                display: block;
  136.                float: left;
  137.           }
  138.           /* —– Textrhythmus und Schriftformatierung | Ende —– */
  139.  
  140.  
  141.           /* —– Struktur-CSS | Start —– */
  142.       #wrapper {
  143.            width: 46.25em; /* elastisch ✌ */
  144.            margin: 0 auto;
  145.       }
  146.  
  147.           h2, p {
  148.            width: 60%;
  149.       }
  150.  
  151.       .marginal-note {
  152.            width: 25%;
  153.            margin-right: 10%;
  154.            float: right;
  155.       }
  156.       /* —– Struktur-CSS | Ende —– */
  157.  </style>
  158. </head>
  159. <body>
  160.      <div id="wrapper">
  161.           <h1><a href="#" title="Zur Startseite gehen">Webtypografie und schick</a></h1>
  162.           <h2 class="byline">von René Schulze</h2>
  163.           <p>
  164.                Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua … . Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor.
  165.           </p>
  166.           <p class="marginal-note">
  167.                <sup>1</sup>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.
  168.           </p>
  169.           <p>
  170.                Lorem ipsum dolor sit amet, consectetur<sup>1</sup> adipisicing elit, sed do eiusmod tempor <span class="amp">&amp;</span> incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  171.           </p>
  172.           <h2>Lorem ipsum dolor sit amet</h2>
  173.           <p>
  174.                Aorem ipsum <sub>dolor</sub> sit amet, consectetur <span class="caps">adipisicing</span> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco »laboris« nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  175.           </p>
  176.      </div>
  177. </body>
  178. </html>

Seperater Download-Link: http://www.weave.de/wp-content/uploads/2009/11/index.html.zip

]]> http://www.weave.de/code/typotricks0609-2/feed 0 WEAVE 06.09 – Softwarearchitektur http://www.weave.de/code/userinterface0609 http://www.weave.de/code/userinterface0609#comments Wed, 04 Nov 2009 05:00:30 +0000 fwolf http://www.weave.de/?p=1755

Flexible User Interfaces

Damit Anwendungen einfach und flexibel angepasst werden können, müssen sie von vorneherein logisch aufgebaut sein. Das spart nicht nur Zeit und Geld sondern auch Nerven. Wie man ganz einfach ein Desktop-User-Interface gegen ein Web-UI austauscht, erklärt Golo Roden in WEAVE 06.2009

Das endgültige Resultat:

using System;
  1. using System.Collections.Generic;
  2. using System.Linq;
  3. using System.Xml.Linq;
  4.  
  5. namespace Microkernel
  6. {
  7.     ///
  8.     /// Represents a service locator.
  9.     ///
  10.     public static class ServiceLocator
  11.     {
  12.         ///
  13.         /// Contains the mappings from contracts to types.
  14.         ///
  15.         private static Dictionary _mappings;
  16.  
  17.         ///
  18.         /// Initializes the  type.
  19.         ///
  20.         static ServiceLocator()
  21.         {
  22.             // Load the configuration.
  23.             _mappings =
  24.                 (from mapping in
  25.                     XElement.Load("ServiceLocator.xml").Element("mappings").Elements("mapping")
  26.                 select
  27.                     new KeyValuePair(
  28.                         Type.GetType(mapping.Attribute("contract").Value),
  29.                         Type.GetType(mapping.Attribute("type").Value))).ToDictionary(
  30.                     kvp =&gt; kvp.Key, kvp =&gt; kvp.Value);
  31.         }
  32.  
  33.         ///
  34.         /// Gets an instance for the specified contract.
  35.         ///
  36.         /// The type of the contract.
  37.         /// An instance that matches the specified contract.
  38.         public static TContract GetService() where TContract : class
  39.         {
  40.             // Instantiate the type and return it to the caller.
  41.             return (TContract)Activator.CreateInstance(_mappings[typeof(TContract)]);
  42.         }
  43.     }
  44. }

Die Konfigurationsdatei, damit der Mikrokernel weiß, welche Klasse bei der Anforderung einer Schnittstelle instanziiert werden soll.

  1. <?xml version="1.0" encoding="utf-8" ?>
  2. <serviceLocator>
  3.  <mappings>
  4.   <mapping contract="" type="" />
  5.  </mappings>
  6. </serviceLocator>
]]> http://www.weave.de/code/userinterface0609/feed 0 WEAVE 06.09 – Generative Gestaltung http://www.weave.de/linklisten/naturalcoding0609 http://www.weave.de/linklisten/naturalcoding0609#comments Wed, 04 Nov 2009 05:00:30 +0000 fwolf http://www.weave.de/?p=1776

Natürliche Intelligenz

Generative Gestaltung fasziniert seit Jahren durch ihren enormen Output. Aber bringt sie die Gestaltung im Sinne einer neuen Ästhetik oder Formsprache weiter? Der Designer Julian Koschwitz hinterfragt in der WEAVE 06.2009 kritisch die aktuellen Entwicklungen und regt dazu an, die der Natur zugrunde liegenden Strukturen und Algorithmen als Inspirationsquelle zu nutzen. Eine Linkliste mit interessanten Beispielen in dieser Richtung hat er im Folgenden zusammen gefasst (übrigens: wir haben Joshua Davis bei der Adobe Max Anfang Oktober in Los Angeles getroffen – er ist ja seit Jahren derjenige, der für die Ausübung generativen Designs schlechthin steht – und ein Video-Interview mit ihm geführt…):

www.james-thompson.co.uk/Main_Work_GenerativeTypography.html

Das generative Typo-Experiment von James Thompson basiert auf Strukturen von Viren

www.opensysdesign.com

Branching-Projekt von Marco Vanucci, bei dem Gebäude auf Grundlage von mathematischen Formel geformt werden, die das Wachstum von Ästen beschreiben

tinyurl.com/n5yxus

Resolution Wall ist ein Architektur-Experiment an der ETH Zürich, bei dem die optimale Architektur eines Gebäudes auf Basis generativer Algorhitmen berechnet wurde

www.interaktivegestaltung.net

Michael Schmitz’ Schriften in seinem Projekt »genoTyp« basieren auf genetischen Regeln

www.james-thompson.co.uk

Typografische Experimente von James Thompson, denen virale Strukturen zugrundeliegen

tinyurl.com/cme2ob

Mitchell Whitelaw programmierte auf Basis des nach dem Mathematiker Murray Eden benannten Eden-Modells (1961) zur Berechnung des Zellwachstums eine Anwendung, die den Buchstaben “D” ornamental mit Ranken durchwachsen lässt

www.jorislaarman.com

Der Bone Chair des Designers Joris Laarman folgt der Frage, wie Stühle wachsen würden, hätten sie Knochen

www.theverymany.net

Die New Yorker Agentur theverymany experimentiert viel mit generativer Gestaltung. Zum Beispiel kreirte sie so die Skulpturen „Echinoids“

www.levitated.net

Auf der Website des Medienkünstlers Jared Tarbell sind viele interessante Kunstwerke zu finden, die mittels generativer Gestaltung entstanden und sich die Natur zum Vorbild oder zur Inspiration nehmen

Tools, die generative Gestaltung einfach ermöglichen

scriptographer.org

Illustrator-Plug-In Scriptographers von Jürg Lehni für generative Gestaltung

Processing.org

“Processing is an open source programming language and environment for people who want to program images, animation, and interactions.”

]]> http://www.weave.de/linklisten/naturalcoding0609/feed 0 WEAVE 06.09 – Manifest für 7 Kreativ-Tugenden http://www.weave.de/video/7tugenden0609 http://www.weave.de/video/7tugenden0609#comments Wed, 04 Nov 2009 05:00:23 +0000 fwolf http://www.weave.de/?p=1794

Kann Onlinewerbung kreativ sein?

Wieso nerven Banner eigentlich und was muss ich tun, damit der Nutzer sie nicht möglichst schnell wegklickt, sondern sich mit einem guten Gefühl darauf einlässt?
Diese Frage stellen sich derzeit viele Kreative.

Damian Rodgett, Geschäftsführer von pilot 1/0, Mike John Otto Geschäftsführer von blackbeltmonkey, Danusch Mahmoudi, Creative Director bei Serviceplan und Michael Kutschinski Geschäftsführer von OgilvyInteractive hielten während der dmexo in Köln ein Plädoyer für digitale Kreativität und sprachen im Anschluss mit WEAVE über die Dos und Donts in der Onlinewerbung.

Manifest für 7 Kreativ-Tugenden from Lena Kristina Knake on Vimeo.

Interview mit Damian Rodgett, Mike John Otto, Danusch Mahmoudi, und Michael Kutschinski von trendspurt Mediendesign und pilot auf Vimeo.

» Weitere Video-Interviews gibt es in unserem Vimeo-Channel unter www.vimeo.com/channels/weave


]]> http://www.weave.de/video/7tugenden0609/feed 0 WEAVE 06.09 – Prototyping http://www.weave.de/linklisten/prototyping0609 http://www.weave.de/linklisten/prototyping0609#comments Wed, 04 Nov 2009 05:00:03 +0000 fwolf http://www.weave.de/?p=1778

Schöpfungsgeschichte

Eigentlich genügen schon ein Haufen Papier und Stifte, um erste Prototypen zu gestalten – welche Mittel und Wege der iterativen Konzeption mit Prototypen es noch gibt, haben Thomas Gläser, Markus Jaritz und Philipp Sackl von envis precisely in WEAVE 06.2009 beschrieben.

What 50 pounds of clay can teach you about design
http://www.lifeclever.com/what-50-pounds-of-clay-can-teach-you-about-design/

Handmade 3D-Paperprototype
http://www.joelswanson.net/diorama/index.html

Prototyping in der Enzyklopädie von interaction-design.org
http://www.interaction-design.org/encyclopedia/prototyping.html

Über Prototyping und iterative Entwicklung
http://www.usabilis.com/gb/usability-engineering/prototyping.htm

Physical sketching
http://www.slideshare.net/petebennett/beatbearing-sketching-vs-prototyping

Physical Sketching (Sketching vs Prototyping with BeatBearing design example)


View more documents from petebennett.

Design Prototyping – bringing wireframes
http://www.slideshare.net/goodfriday/design-prototyping-bringing-wireframes-to-life

Design Prototyping: Bringing Wireframes to Life


View more presentations from goodfriday.

Build Confidence with Prototypes
http://requirements.seilevel.com/blog/2006/06/build-confidence-with-prototypes.html

About Paper Prototyping
http://www.alistapart.com/articles/paperprototyping

I love Wireframes
http://wireframes.tumblr.com

Just build it – html Prototyping and Agile Development
http://www.digital-web.com/articles/just_build_it_html_prototyping_and_agile_development

]]> http://www.weave.de/linklisten/prototyping0609/feed 0 WEAVE 06.09 – HTML5 http://www.weave.de/linklisten/html50609 http://www.weave.de/linklisten/html50609#comments Wed, 04 Nov 2009 05:00:02 +0000 fwolf http://www.weave.de/?p=1772

Eintauchen in HTML 5

HTML5 revolutioniert das Web, meint Sebastian Deutsch – Gründer der Agentur 9elements. Er berichtet in WEAVE 06.2009 über die Potentiale, Möglichkeiten und das derzeit bereits Machbare. Außerdem stellt er hier noch ein paar gute Quellen zum Thema zur Verfügung:

Ressourcen zum audio-Tag von HTML5
http://html5doctor.com/native-audio-in-the-browser/
http://hyper-metrix.com/open-source/jai/

Ressourcen zu Drag & Drop in HTML5
http://html5demos.com/drag

Ressourcen zur Geolocationabfrage mit HTML5
http://html5demos.com/geo
https://developer.mozilla.org/En/Using_geolocation
http://hacks.mozilla.org/2009/06/geolocation/

Ressourcen zu semantischen Tags in HTML5
http://adactio.com/extras/pocketbooks/html5/
http://boblet.tumblr.com/post/134276674/html5-structure2
http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#the-nav-element
http://www.alistapart.com/articles/semanticsinhtml5
http://html5doctor.com/how-to-get-html5-working-in-ie-and-firefox-2/
http://html5doctor.com/block-level-links-in-html-5/
http://www.protofunc.com/2009/08/16/meinung-zu-html5/

]]> http://www.weave.de/linklisten/html50609/feed 0