tonakademie bietet online Musik-Kurse an

tonakademie

Wer hier häufiger mal vorbeischaut, wird schon mitbekommen habe, dass ich gerne Websites vorstelle, die ich bei Web2Null entdeckt habe. Diesmal ist dies die tonakademie aus Erding. Hier kann man online Musikinstrumente spielen lernen. Derzeit sind dies etwa Gitarre und Schlagzeit für Anfänger sowie Praxis-Kurse für E-Bass und etwas, dass sich Funky Drumming nennt.

In die Kurse kann man kostenfrei reinschnuppern, wer aber den vollen Lernumfang inkl. Videos, Noten, Übungen, Playalongs, Aufgaben und das Kursforum nutzen möchte, zahlt € 19,95 für 30 Tage. Weitere Kurse werden, wie die bestehenden auch, mit ausgebildeten Musikern erarbeiten.

E-Learning ist ja schon so lange eine kommendes großes Ding im Web, dass ich echt mal froh bin, so ein Angebot, wie das von der tonakademie zu Gesicht zu bekommen. Auch wenn ich selbst so fürchterlich unmusikalisch bin, dass dieses Angebot für mich schlichtweg rausgeworfenes Geld wäre.

Cheat sheets für Web-Entwickler

Cheat Sheet

Cheat sheet übersetzt man wohl am besten mit “Spickzettel” und im Netz gibt es sie inzwischen in x-facher Form. Denn es ist fast schon zu einem Sport für Web-Entwickler, -Designer und Konzepter geworden, solche Spickzettel für die unterschiedlichsten Bereiche anzulegen. Zudem tun dann auch Blogger und Online-Redakteure das, was sie bei einer solchen Schwemme gerne tun: Sie legen Listen an.

Ich für meinen Teil lege darum heute auch eine Liste an, eine Meta-Liste mit Cheat-Sheet-Listen:

Methoden zur Visualisierung als Periodensystem

A Periodic Table of Visualization Methods

In der Grafik oben wird eine Übersicht über Visualisierungsmethoden in Form eines Periodensystems gezeigt. Und auch, wenn diese Infografik schon einiges verrät, offenbart sie die ihn ihr steckenden Informationen erst auf der Ursprungswebseite A Periodic Table of Visualization Methods auf Visual Literacy. Denn dort ist hinter jedem “Element” ein anschauliches Beispiel hinterlegt, ähnlich einem Adventskalender. Per Mouseover wird einem dort offenbart, was es jenseits von Excel-Tabellen und Mind-Maps, noch an Möglichkeiten gibt, Daten und Informationen aufzubereiten.

Fundsters – themenoffenes Crowdfunding

Fundsters

Mit Fundsters steigt eine weitere Crowdfunding-Plattform in den Ring. Das Start-up aus dem niederrheinischen Meerbusch lässt die thematische Ausrichtung der zu finanzierenden Projekte offen, was sie von einigen Mitbewerbern abgrenzt.

Fundsters bietet dabei zwei grundlegende Wege der Ideenfinanzierung an: Die Investition, die einen später an den Gewinnen und Wertsteigerungen des Projekts teilhaben lässt und die Möglichkeit dem Projekt über einen finanziellen Beitrag auf die Beine zu helfen.

Der Anteil, den sich Fundsters für seine Dienstleistung abzweigt, hört sich für mich durchaus fair an: 4% der Fundingsumme für eingegangene Finanzierungsbeiträge und 9% für Investitionen. Ausgezahlt wird nur, wenn das Fundingziel erreicht ist. Andernfalls bekommen die Unterstützer ihr beigesteuertes Geld vollständig wieder zurück.

— via Web2Null

RDW Wireframing – Online Tool für responsive Mockups

RDW Wireframing

Wer mal auf die schnelle ein einfaches, aber doch responsives Mockup für eine Webseite machen möchte, kann sich ja mal RDW Wireframing ansehen. Dies ist ein Online-Tool für Informationsarchitekten und Konzepter, das zwar kaum professionellen Ansprüchen genügen wird. Doch für zwischendurch, vielleicht auch unterwegs, ist RWD Wireframing durchaus eine Option. Das Tool kann übrigens auch via Github heruntergeladen werden.

— via Wireframing Magazin

Word-Art – künstlerisch mit Schrift umgehen

Wordart Example

Nein, hier geht es nicht um das schreckliche Wordart von Microsoft Word. Es geht um richtige Kunst. Denn als ich auf Dressed Like Machines die folgende Grafik über Word-Art entdeckt habe, war ich sofort extrem begeistert. Aber schaut es euch selbst an: || Den ganzen Beitrag lesen »

Design-Guru Hartmut Esslinger über Gestaltung

Hartmut Esslinger

Vor ein paar Wochen habe ich in der Süddeutschen Zeitung ein Interview mit dem Design-Guru Hartmut Esslinger gelesen. Leider habe ich es versäumt, die Ausgabe zu retten, bevor sie bei Anzünden unserer Stückholz-Heizung Verwendung fand. Doch weil mich das Interview mit dem kongenialen Partner von Steve Jobs schon nach wenigen Zeilen ziemlich beeindruckt hat, habe ich mir zum Glück direkt beim Lesen ein paar Stichwort zu seinen zentralen Thesen aufgeschrieben. Zu denen möchte ich gleich kommen, doch zunächst ein paar Zeilen zu Hartmut Esslinger und seiner Arbeit.

Der in Beuren bei Karlsruhe geborenen Esslinger, hat als Designer und Gründer von frog design einige wichtige Weichen im Bereich Produkt- und Software-Design gestellt. So zeichnet er u.a. verantwortlich für das richtungweisende Design des Apple IIc, des NeXTcube und auch bei der Gestaltung von Windows XP war er maßgeblich beteiligt. Mit Steve Jobs hatte er eine intensive Arbeitsbeziehung, die den guten Ruf von Apple als zuverlässigen Design-Trendsetter erst möglich gemacht haben soll.

Nun aber zu den Design-Thesen Esslingers: Im Mittelpunkt einer jeder gestalterischen Maßnahme steht immer der Mensch … und nicht der Gegenstand. Design muss bei den Menschen etwas auslösen. Darum muss man ihnen immer auch Raum für eigene Interpretationen lassen. Niemals darf man beim Design Kompromisse machen. Und auch wenn viele das denken, bei der Gestaltung, kommt es nicht auf Schönheit an. Viel mehr müssen die Proportionen stimmen und die Bedienelemente richtig positioniert sein. Zu guter Letzt ist es dann noch wichtig, dass egal was man gestaltet, man es für heute gestaltet. Nur dann kann es zeitlos werden.

Mir zeigt dies, wie wichtig z.B. in der Web-Gestaltung der Bereich der User Experience ist. Beim Design einer Website müssen zunächst einmal die zentralen Bedürfnisse der Nutzer berücksichtigt werden. Und die liegen meist darin, dass sie entweder die gesuchten Informationen reibungslos finden oder die Website einwandfrei funktioniert. Die Schönheit der Website ist hier absolut zweitrangig. Wichtiger ist, dass die Optik einer Website den Erwartungen der Nutzer entspricht. Einer kleinen Pension im Thüringer Wald lässt man ein rustikales Erscheinungsbild eher durchgehen, als einer internationalen Hotel-Kette. Doch wichtig ist, dass die Nutzer in beiden Fällen möglichst auf den ersten Blick erkennen, wie sie an ihre Informationen z.B. über Preis oder Anfahrt kommen.

Besonders spannend finde ich jedoch den Aussage Esslingers, dass man beim Design niemals Kompromisse machen darf. D.h. auch, dass man bei einem Dissens immer dazu bereit sein muss, eine ganz neue Lösung zu suchen. Zu einer ähnlichen Erkenntnis ist seinerzeit auch schon Albert Einstein gekommen. Er hat es folgendermaßen ausgedrückt:

Zwei Dinge sind zu unserer Arbeit nötig: Unermüdliche Ausdauer und die Bereitschaft, etwas, in das man viel Zeit und Arbeit gesteckt hat, wieder wegzuwerfen.

Dem habe ich nichts mehr hinzuzufügen.

Online-Vertrieb: Sieben Usability-Todsünden

KISSmetrics - 7 Usability Mistakes That Will Kill Your Online Sales

Bei den amerikanischen Kollegen von KISSmetrics gibt es einen interessanten Artikel, den ich euch nicht vorenthalten möchte. Sie listen dort sieben Usability-Todsünden beim Online-Vertrieb auf.

Die 7 schwerwiegenden Fehler, die Gregory Ciotti dort zusammengetragen hat, sind folgende:

  1. Fehlender Schwerpunkt auf den Überschriften
  2. Lange Seiten-Ladezeiten
  3. Unlesbare Typografie und Abstände
  4. Lesegewohnheiten beim Gestalten vernachlässigen
  5. Verwirrende Navigation
  6. Blindes Vertrauen auf die »3-Klick-Regel«
  7. Falsche Abstände und lange Landing-pages

Warum diese Usability-Sünden so gravierend sind, zeigt Gregory Ciotti anhand von Beispielen und Studien auf KISSmetric ausführlich auf. Darum jetzt nix wie rüber…

Ein paar ausgesuchte Lesetipps … mal wieder

Lesetipps

Heute gibt es mal wieder ein paar Linktipps von ein paar erwähnenswerten Beiträgen bzw. Artikeln aus dem Netz. Los geht’s mit einer…

Mini-Studie: Einsatz von Shopsystemen in Deutschland

Auf Webzapper, dem E-Commerce-Blog der FH Wedel hat Jan-Philipp Evers eine Mini-Studie zum Einsatz von Shopsystemen in Deutschland veröffentlicht. Soviel schon mal vorab: Intershop ist der absolute Platzhirsch in diesem Marktsegment.

Social Media Image Maker

Ein feines Online-Tool für social-media-affine Menschen hat Autre planète aus Paris im Angebot. Für immerhin 16 Social-Media-Dienste haben die Franzosen ein Online-Grafik-Werkzeug geschaffen, mit dem man sich sehr komfortabel Bilder für die unterschiedlichen Verwendungen auf den jeweiligen Website zurecht schneiden lassen kann.

Niedliche Animation statt langweiligem Ladebalken

Tamim Swaid zeigt auf ux·zentrisch, einem meiner favorisierten User-Experience-Blogs, eine schöne Alternative zu langweiligen Ladebalken auf.

Berufsbegleitende Qualifizierung bzw. Weiterbildung für angehende Usability Professionals

Machen wir thematisch ein kleiner Sprung zur Usability: Der UX-Experte Ulf Schubert listet auf seinem User Experience Blog einige Möglichkeiten auf, wie man sich in Deutschland in Sachen User Experience aus- bzw. weiterbilden lassen kann.

Twopcharts: Tracking Twitter users

Zum Schluss noch eine kleine Spielerei für Twitter-Fans: Twopcharts ist ein Dienst, der ein paar Statistiken zur allgemeinen, aber auch zur eigenen Nutzung von Twitter aufbereitet. Mein Twopcharts-Profil gibt es übrigens hier…

BLOKK – Font-Alternative zu Blindtext

BLOKK

Es würde mich wundern, wenn es einen Informationsarchitekt oder -designer gäbe, der nicht mindestens schon einmal die großen Augen eines Kunden zu Gesicht bekommen hätte, welcher sich über Blindtext wunderte. Und es gibt ja auch immer wieder mal irgendwo die netten Screenshots von Webseiten, auf denen der Blindtext beim Launch nicht ausgetauscht wurde.

Eine interessante Alternative zu Lorem Ipsum und Co. ist die Schriftart BLOKK. Bei dieser Schriftart ist jeder Buchstabe ein Block. Das hat u.a. den Vorteil, dass ein Kunde bei diesem Text nun wahrlich nicht mehr versuchen wird, sein kleines Latinum auszupacken. Lorem ipsum mit BLOKK gesetzt, sieht dann z.B. so aus:

Lorem ipsum - Font BLOKK

Hierbei handelt es sich um einen Screenshot einer HTML-Datei. Und wer sagt, dass es für so ein paar schwarze Balken keine eigene Schriftart braucht und man das schnell mal in Photoshop mit eine paar Rechtecken ebenso hinbekommen könnte, dem sei gesagt, dass es sich hierbei immer noch um Text handelt. D.h. auch, dass sich die Balken genau so verhalten, wie Text. Dieser hier ist mit folgenden CSS-Parametern gesetzt:

font-family: BLOKK Neue;
font-size: 16px;
line-height: 1em;

Natürlich macht die Verwendung von BLOKK vor allem im konzeptionellen Kontext Sinn. Im Design-Prozess sollte (Fließ-)Text dann schon in der Schriftart gesetzt werden, die später verwendet wird, damit der gestalterische Gesamteindruck stimmt. Aber für Mockups/Wireframes ist BLOKK eine interessante Alternative zu Blindtext.

Runterladen kann man BLOKK auf blokkfont.com … ganz unten auf der Seite.

— via Wireframe Magazine