Successfully reported this slideshow.
A GUI Best-Practices Example Ableton Live Techtalk von Henning Bergmeyer 20.10.2009
Übersicht <ul><li>Hintergrund: </li></ul><ul><ul><li>GUI-Standards: ISO 9241 </li></ul></ul><ul><ul><li>Echtzeit Klangbear...
Richtlinien der Interaktion zwischen Mensch und Computer ( EN ISO 9241) <ul><li>EN ISO 9241-11 Gebrauchstauglichkeit </li>...
Musik und Klang <ul><li>Musik  ist die organisierte Form von Schallereignissen im von Menschen hörbaren Frequenzband </li>...
Workflow Real-time Sound Editing und Komposition <ul><li>Generierung von Klang, Harmonien   und Rhythmen </li></ul><ul><ul...
Notationen <ul><li>Noten </li></ul><ul><li>Tracker Patterns </li></ul><ul><li>Bars </li></ul>
Einige Features von Ableton Live <ul><li>Bar Pattern Sequencer </li></ul><ul><li>Multi-Tracking  </li></ul><ul><li>Synthes...
First Look on Ableton Live: Layout <ul><li>Dateiverwaltung </li></ul><ul><li>Online-Tutorials </li></ul><ul><li>Browser  <...
Arbeitsumgebung: Studio mit Modularsystem <ul><li>http://trashaudio.blogspot.com/2007/11/workspace-and-environment-captain...
Arbeitsumgebung <ul><li>GUI ist bei vielen Programmen Studiogeräten nachempfunden </li></ul><ul><ul><li>Vorteile </li></ul...
Signal-Routing im Rack per virtueller Kabel in Propellerheads Reason Bild: http://www.musicianslife.de/wp-content/uploads/...
Signal-Routing in Jeskola Buzz / BUZZle
Look & Feel von Ableton Live <ul><li>Einheitliche Darstellung </li></ul><ul><ul><li>Plug-ins bekommen automatisch zusätzli...
Star Trek GUI http://www.lcarsdeveloper.com /
Look & Feel von Ableton Live <ul><li>Kurze Befehlssequenzen </li></ul><ul><ul><li>kompakte Darstellung, z.B. durch Überlag...
Reiche GUI-Funktionen <ul><li>Layout zoom- und scrollbar </li></ul><ul><ul><li>Side-Views </li></ul></ul><ul><ul><li>Main-...
Datenmanagement <ul><li>Live-Browser </li></ul><ul><ul><ul><li>Instrumente </li></ul></ul></ul><ul><ul><ul><li>Midi-Effekt...
Demo der Ableton-Live GUI <ul><li>Look & Feel und Layout </li></ul><ul><li>Integration von Hilfe und Tutorials </li></ul><...
Beispielkonfiguration für viele Aufnahme und Controller-Kanäle
Fazit <ul><li>Ableton Live ist mehr als gebrauchstauglich </li></ul><ul><ul><li>effiziente Handhabung (Ansichten, Wiederve...
Links <ul><li>GUI-Standards </li></ul><ul><ul><li>ISO9241:  http://de.wikipedia.org/wiki/ISO_9241 </li></ul></ul><ul><li>M...
Nächste SlideShare
Wird geladen in …5
×

A GUI Best-Practices Example: Ableton Live

2.321 Aufrufe

Veröffentlicht am

Klang- und Musik-Produktion ist ein komplexer Arbeitsprozess der Software nicht nur Sequencing und flexibles Routing von Signalquellen und Filtern mit vielen Parametern abverlangt. Es müssen auch Projekte mit u.U. vielen Dateien verwaltet, Fehler vermieden und Anpassung auf viele verschiedene Hardware-Komponenten und Typen von Arbeitsabläufen vorgenommen werden können. Der Techtalk zeigt, wie gut sich Ableton Live in diesen Disziplinen schlägt indem es es ein flexibles und aufgeräumtes GUI mit integreirter Hilfe bereitstellt, das die Anforderungen von EN ISO 9241 nach subjektiven Masstäben mehr als erfüllt.

Veröffentlicht in: Design, Technologie, Unterhaltung & Humor
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

A GUI Best-Practices Example: Ableton Live

  1. 1. A GUI Best-Practices Example Ableton Live Techtalk von Henning Bergmeyer 20.10.2009
  2. 2. Übersicht <ul><li>Hintergrund: </li></ul><ul><ul><li>GUI-Standards: ISO 9241 </li></ul></ul><ul><ul><li>Echtzeit Klangbearbeitung, Komposition und Aufzeichnung </li></ul></ul><ul><li>Ableton Live GUI </li></ul><ul><ul><li>Layout, Look & Feel </li></ul></ul><ul><ul><li>Signalfluss (Vergleich mit anderen Routing-Ansätzen) </li></ul></ul><ul><ul><li>Widgets </li></ul></ul><ul><ul><li>Management von Dateien und Presets </li></ul></ul><ul><ul><li>Usability </li></ul></ul><ul><li>Demo </li></ul>
  3. 3. Richtlinien der Interaktion zwischen Mensch und Computer ( EN ISO 9241) <ul><li>EN ISO 9241-11 Gebrauchstauglichkeit </li></ul><ul><ul><li>Effektivität zur Lösung einer Aufgabe, </li></ul></ul><ul><ul><li>Effizienz der Handhabung des Systems, </li></ul></ul><ul><ul><li>Zufriedenheit der Nutzer einer Software. </li></ul></ul><ul><li>EN ISO 9241-110 Grundsätze der Dialoggestaltung </li></ul><ul><ul><li>Aufgabenangemessenheit </li></ul></ul><ul><ul><li>Selbstbeschreibungsfähigkeit </li></ul></ul><ul><ul><li>Lernförderlichkeit </li></ul></ul><ul><ul><li>Steuerbarkeit </li></ul></ul><ul><ul><li>Erwartungskonformität </li></ul></ul><ul><ul><li>Individualisierbarkeit </li></ul></ul><ul><ul><li>Fehlertoleranz </li></ul></ul>
  4. 4. Musik und Klang <ul><li>Musik ist die organisierte Form von Schallereignissen im von Menschen hörbaren Frequenzband </li></ul><ul><ul><li>Tonhöhe : Melodie und Harmonie </li></ul></ul><ul><ul><li>Klangfarbe : Schallspektrum und sein zeitlicher Verlauf </li></ul></ul><ul><ul><li>Rhythmus : Tempo, Metrum, Artikulation </li></ul></ul><ul><ul><li>Dynamik </li></ul></ul><ul><ul><li>Textur </li></ul></ul><ul><li>„ There is no noise, just sound.“ John Cage (* 1912 , † 1992) </li></ul><ul><li>physikalisch: Frequenz, Amplitude, Phase, veränderliche Mischung im zeitlichen Verlauf </li></ul><ul><li>mathematisch: Signal meist intervallweise fourier-transformiert </li></ul>http://commons.wikimedia.org/wiki/File:2006-02-13_Drop-impact.jpg
  5. 5. Workflow Real-time Sound Editing und Komposition <ul><li>Generierung von Klang, Harmonien und Rhythmen </li></ul><ul><ul><li>Sampling </li></ul></ul><ul><ul><li>Synthese </li></ul></ul><ul><li>Modellierung eines Klangraums und Positionierung der Klangquellen </li></ul><ul><ul><li>Verzögerung </li></ul></ul><ul><ul><li>Hall </li></ul></ul><ul><ul><li>Resonanz / Dämpfung </li></ul></ul><ul><li>Abmischung für Ausgabemedium </li></ul><ul><li>Andere WFs: DJ-ing, Scoring, … </li></ul>
  6. 6. Notationen <ul><li>Noten </li></ul><ul><li>Tracker Patterns </li></ul><ul><li>Bars </li></ul>
  7. 7. Einige Features von Ableton Live <ul><li>Bar Pattern Sequencer </li></ul><ul><li>Multi-Tracking </li></ul><ul><li>Synthese & Effekte </li></ul><ul><li>Signal-Routing & Mixing </li></ul><ul><li>Racks & Chains (Zusammenfassen von Komponenten)‏ </li></ul><ul><li>Szenen </li></ul><ul><li>Anbindung externer (Midi-) Controller </li></ul><ul><li>Automation </li></ul><ul><li>Verwaltung von Dateien und Presets </li></ul><ul><li>Integrierte Online-Hilfe und Tutorials </li></ul>
  8. 8. First Look on Ableton Live: Layout <ul><li>Dateiverwaltung </li></ul><ul><li>Online-Tutorials </li></ul><ul><li>Browser </li></ul><ul><li>Instrumente, Effekte, Presets, </li></ul><ul><li>Dateien, </li></ul><ul><li>Grooves </li></ul><ul><li>Quick Help </li></ul><ul><li>Tempo- und Ablaufsteuerung </li></ul><ul><li>MIDI </li></ul><ul><li>Arrangement-View </li></ul><ul><li>Session-View </li></ul><ul><li>Clip-View </li></ul><ul><li>Spur-View </li></ul>
  9. 9. Arbeitsumgebung: Studio mit Modularsystem <ul><li>http://trashaudio.blogspot.com/2007/11/workspace-and-environment-captain-ahab.html </li></ul>
  10. 10. Arbeitsumgebung <ul><li>GUI ist bei vielen Programmen Studiogeräten nachempfunden </li></ul><ul><ul><li>Vorteile </li></ul></ul><ul><ul><ul><li>Leichte Einarbeitung für Hardware-Erfahrene </li></ul></ul></ul><ul><ul><ul><li>Hübsche Optik / Nostalgie </li></ul></ul></ul><ul><ul><li>Nachteile </li></ul></ul><ul><ul><ul><li>Starre, uneinheitliche Anordnung der Bedienelement </li></ul></ul></ul><ul><li>Toll für Studio-Veteranen, Nostalgiker und Bastler, weniger für konstruktives Vorgehen. </li></ul>http://media.createdigitalmedia.net/cdmu/images/storiespre2k6/b4ii.jpg
  11. 11. Signal-Routing im Rack per virtueller Kabel in Propellerheads Reason Bild: http://www.musicianslife.de/wp-content/uploads/2008/01/reasonhinten1r4.jpg http://www.delamar.de/wp-content/uploads/2007/06/reason_4_reason4.jpg
  12. 12. Signal-Routing in Jeskola Buzz / BUZZle
  13. 13. Look & Feel von Ableton Live <ul><li>Einheitliche Darstellung </li></ul><ul><ul><li>Plug-ins bekommen automatisch zusätzliche Live-konforme UI </li></ul></ul><ul><ul><li>Gruppierung funktionaler Einheiten </li></ul></ul><ul><ul><ul><li>Synthese- u. Filter-Parameter </li></ul></ul></ul><ul><ul><ul><li>Spuren, Signal-Ketten, Racks </li></ul></ul></ul><ul><ul><ul><li>Szenen, Sets </li></ul></ul></ul><ul><ul><li>Farben und Zoom-Faktor anpassbar </li></ul></ul><ul><ul><li>Entfernt angelehnt an Star-Trek -Stil </li></ul></ul>
  14. 14. Star Trek GUI http://www.lcarsdeveloper.com /
  15. 15. Look & Feel von Ableton Live <ul><li>Kurze Befehlssequenzen </li></ul><ul><ul><li>kompakte Darstellung, z.B. durch Überlagerungen </li></ul></ul><ul><ul><li>Kontextmenüs </li></ul></ul><ul><ul><li>Nur zwei Hauptansichten </li></ul></ul><ul><ul><li>Routing über Spuren, Gruppen und Geräte </li></ul></ul>
  16. 16. Reiche GUI-Funktionen <ul><li>Layout zoom- und scrollbar </li></ul><ul><ul><li>Side-Views </li></ul></ul><ul><ul><li>Main-View </li></ul></ul><ul><li>Anzeigen </li></ul><ul><ul><li>Progress </li></ul></ul><ul><ul><li>Level, Peak, Panorama </li></ul></ul><ul><ul><li>Clips‏ </li></ul></ul><ul><ul><li>Kanäle und Szenen </li></ul></ul><ul><ul><li>Spektrum </li></ul></ul><ul><ul><li>Routing </li></ul></ul><ul><li>Steuer-Elemente </li></ul><ul><ul><li>Knobs, Slider, Switches </li></ul></ul><ul><ul><li>Hüllkurven und EQ </li></ul></ul><ul><ul><li>Racks + Makros </li></ul></ul><ul><ul><li>Midi-Controller-Belegung </li></ul></ul>
  17. 17. Datenmanagement <ul><li>Live-Browser </li></ul><ul><ul><ul><li>Instrumente </li></ul></ul></ul><ul><ul><ul><li>Midi-Effekte </li></ul></ul></ul><ul><ul><ul><li>Audio-Effekte </li></ul></ul></ul><ul><ul><ul><li>Plugin-Browser </li></ul></ul></ul><ul><ul><ul><li>3 User-Verzeichnisse </li></ul></ul></ul><ul><ul><ul><li>Grooves </li></ul></ul></ul><ul><ul><li>Drag’n’Drop u. Hot-Swap </li></ul></ul><ul><ul><li>Dateisystem-Operationen </li></ul></ul><ul><ul><li>Stichwortsuche </li></ul></ul><ul><ul><li>Vorhörfunktion </li></ul></ul><ul><li>Dateimanager </li></ul><ul><ul><li>Verwaltung von Projektdateien </li></ul></ul>
  18. 18. Demo der Ableton-Live GUI <ul><li>Look & Feel und Layout </li></ul><ul><li>Integration von Hilfe und Tutorials </li></ul><ul><li>Navigation: Ansichten, Zoomen, Konfiguration </li></ul><ul><li>Arrangement-Ansicht </li></ul><ul><ul><li>Clips und Mischung </li></ul></ul><ul><li>Session-Ansicht </li></ul><ul><ul><li>Instrumente und Clips (Drag’n’Drop) </li></ul></ul><ul><ul><li>Signal-Ketten, Routing und Effektsteuerung </li></ul></ul><ul><ul><li>Automation </li></ul></ul><ul><li>Racks </li></ul><ul><ul><li>Makro-Controller: Zusammenfassung von Ketten </li></ul></ul><ul><ul><li>Keyboard-Zonen-Belegung mittels Racks </li></ul></ul>
  19. 19. Beispielkonfiguration für viele Aufnahme und Controller-Kanäle
  20. 20. Fazit <ul><li>Ableton Live ist mehr als gebrauchstauglich </li></ul><ul><ul><li>effiziente Handhabung (Ansichten, Wiederverwendung, Kontext-Aktionen) </li></ul></ul><ul><ul><li>Einsatzspektrum nur beschränkt durch Rechnerleistung </li></ul></ul><ul><li>Einhaltung der Grundsätze der Dialoggestaltung </li></ul><ul><ul><li>bietet ein mehr als komplettes Basis-Set von Audio-Komponenten und effizienten Funktionen zu ihrer Organisation </li></ul></ul><ul><ul><li>Direktes, latenzfreies Aktionsfeedback an den Widgets und durch real-time Sound </li></ul></ul><ul><ul><li>Integrierte Hilfe und logisches Layout </li></ul></ul><ul><ul><li>Lernunterstützung durch integrierte Tutorials und konsistente Metaphern </li></ul></ul><ul><ul><li>Kaum Dialog-Vorgaben durch kurze Transaktionen </li></ul></ul><ul><ul><li>Parameter sind Standardkonform benannt und gruppiert </li></ul></ul><ul><ul><li>Individualisierbar durch Farben, Zoom, Datenmanagement, Presets… </li></ul></ul><ul><ul><li>Läßt keine fehlerhaften Eingaben zu </li></ul></ul>
  21. 21. Links <ul><li>GUI-Standards </li></ul><ul><ul><li>ISO9241: http://de.wikipedia.org/wiki/ISO_9241 </li></ul></ul><ul><li>Musikproduktion </li></ul><ul><ul><li>Ableton Live: http:// www.ableton.com </li></ul></ul><ul><ul><li>Buzz: http://www.buzzmachines.com , BUZZle: http://www.buzzle.de </li></ul></ul><ul><li>Star Trek GUI: http://www.lcarsdeveloper.com/ </li></ul><ul><li>Für Sound-Interessierte: </li></ul><ul><ul><li>Physical Modelling mit Ableton Collision : http://www.musicianslife.de/2009/07/10/ableton-collision/ </li></ul></ul>

×