SCREENGUIDE04/2017的目錄

MAVO Mit Mavo ergänzen Sie eine statische Webseite um reaktive Elemente, die es Ihnen ermöglichen, Inhalte auf der Seite zu verändern, ohne dass Sie dafür extra ein CMS benötigen. Dazu binden Sie eine CSS- und eine JS-Datei in Ihre Webseite ein und legen über die Attribute „mv-app” und „property” fest, welcher Bereich der Webseite bzw. welche konkreten Elemente bearbeitet werden dürfen. Über „mv-storage” teilen Sie Mavo mit, wo die Daten gespeichert werden sollen. Möglich ist die Speicherung im localStorage des Browsers, auf Github, in der Dropbox oder in einem HTML-Element. Ist zum Beispiel GitHub vorgesehen, können Nutzer, die Commit-Rechte am entsprechenden Repository haben, Änderungen direkt vornehmen und ins Repository speichern. Eine Änderung von einem GitHub-Nutzer ohne Commit- Recht wird als Vorschlag behandelt und ein Pull Request erstellt. Alternativ können Sie…

Kryptowährungen wie Bitcoin, Ethereum, Litecoin oder Ripple sind in den vergangenen Monaten immer wieder in die Schlagzeilen gekommen. Bitcoin zum Beispiel erlebt regelmäßig neue Kurshöhenflüge. Laut bitcoin.de zahlte man Ende August um die 3.700 Euro pro Bitcoin. Zum Vergleich: Im Januar 2015 waren es noch zwischen 200 und 300 Euro. Kurz vor Redaktionsschluss hat eine Bitcoin-Spaltung (Hard-Fork) und die daraus entstandene neue Währung Bitcoin Cash für einigen Wirbel bei den Kursen gesorgt. Aber um was geht es bei den digitalen Währungen überhaupt, und wie sehen Experten die Chancen und Risiken des Computergolds? WEGBEREITER BITCOIN Bitcoin ist die erste Kryptowährung und seit 2009 im Umlauf. Der Vater der Bitcoins versteckt sich hinter dem Pseudonym Satoshi Nakamoto und stammt angeblich aus Japan. Die genaue Identität ist aber nicht bekannt, auch wenn in…

Was geschieht mit einer App, wenn ein antizipierter Worst Case schlimmer ausfällt als gedacht? Wie stellen wir eine Tabelle dar, wenn diese mal eine Spalte, mal zwanzig anzeigt. Haben wir Überschriften mit dreißig oder hundert Zeichen? Bilden wir einen einzigen Aktionsknopf ab oder fünf? Vor diesen Fragen standen wir, als wir vor circa einem Jahr mit dem Projekt einer vollkommen generischen und responsiven Webapplikation starteten. EIN KUNDENINDIVIDUELLES PRODUKTPORTAL Das Bochumer Unternehmen eggheads ist ein spezialisiertes Softwarehaus für Produktinformation-Management-Systeme (kurz PIM). Unser Kundenportfolio ist über diverse Branchen breit gestreut. Von großen Touristikunternehmen über Universalversender bis hin zu Kunden aus der Medizintechnik sind fast alle Branchen vertreten. Da eine Vielzahl unserer Kunden den Wunsch äußerte, Daten nicht nur per nativem Client zu pflegen und bereitzustellen, entstand unser webbasiertes Produkt namens Content Portal,…

Es ist ein weiter Weg, den Umbraco-Erfinder Niels Hartvig seit Beginn seines Projekts beschritten hat. Ein Weg, der in Kopenhagen begann und bis heute zu über 400.000 Live-Sites, mehr als 200.000 aktiven Nutzern im Community-Forum, fast 300 Partnern und verschiedenen Konferenzen und Entwickler-Festivals weltweit geführt hat. Aus seiner Ein-Mann-Entwicklerwerkstatt ist inzwischen ein Unternehmen mit über 30 Mitarbeitern geworden. Geplant war der Erfolg des Systems, das Hartvig seit 2000 als CMS-Alternative für einen Auftraggeber entwickelt hatte, dabei wirklich nicht. Umbraco sollte ein Tool für ihn selbst werden: neu, flexibel und alles andere als das, was er sich unter CMS vorstellte. Entstanden ist dabei ein System, das sich schon allein vom Grundsatz von vielen Konkurrenten unterscheidet [umbraco.com]. Umbraco basiert auf ASP.NET, dem Web-Framework von Microsoft. Im Gegensatz zu vielen PHP-basierten Content- Management-Systemen…

Hardware aus dem Hause Microsoft ist beileibe kein vollkommen neues Phänomen. Tatsächlich kam bereits 1982 eine Computermaus des Herstellers auf den Markt. Mit der Spielekonsole Xbox mit dem Erkennungszusatz Kinect und der VR-Brille HoloLens hat Microsoft auch sehr trendige Geräte im Angebot. Den ersten eigenen Rechner präsentierte das Unternehmen vor fast genau fünf Jahren, als das erste Surface erschien, ein Hybrid-Tablet mit anheftbarer Tastatur. Weitere Surface-Geräte folgten in Form von Detachables oder reinrassigen Notebooks. Und nun also hat Microsoft seine Surface-Reihe um den ersten PC erweitert. ARBEITEN WIE AUF EINEM ZEICHENBRETT PCs gibt es viele, daher machen wir etwas vollkommen anderes. Dieses oder etwas Ähnliches dürften sich die Microsoft-Entwickler gedacht haben, als die Planung für das Surface Studio begann. Herausgekommen ist in der Tat ein Rechner, der sich in einigen…

Der erste mir bekannte Artikel, der das Ende von RSS prophezeite, stammt aus dem Mai 2009. Steve Gillmor beschrieb auf Techcrunch unter dem Titel „Rest in Peace, RSS”, warum er Twitter als den neuen „River of News” sehe und dass RSS einfach nicht mehr zeitgemäß sei [goo.gl/3W3KrK]. „Es ist Zeit, sich komplett von RSS zu befreien und auf Twitter zu wechseln. RSS kann einfach nicht mehr mithalten.“ Steve Gillmor, Techcrunch, 2009 Spätestens seit diesem Artikel erleidet RSS jedes Jahr einen neuen „Schicksalsschlag”. 2010 entschied sich die ActivityStreams Community, von RSS/Atom auf JSON zu wechseln [goo.gl/J9qPCn], 2011 entfernten die populären Browser das RSS Icon [goo. gl/4FSuJS], 2012 erklärte Robert Scoble RSS und das komplette Open Web für überholt [goo.gl/7znihK], und 2013 kündigte Google an, den Google-Reader einzustellen [goo.gl/MC7cS5]. Der Google-Reader war…

BROWSER Virtual Reality: Mit der neuen Version 55 unterstützt Firefox als erster Desktop-Browser die WebVR API. Damit können Sie Inhalte für Virtual Reality direkt im Browser ansehen. Sobald Sie ein interessantes Spiel oder eine App entdeckt haben, die VR unterstützt, zeigt Ihnen Firefox ein VR-Brillen-Symbol an. Nun benötigen Sie nur noch die entsprechende Hardware, also etwa eine Oculus Rift oder eine HTC Vive, und können mit einem Klick in die virtuelle Realität eintauchen. Allerdings funktioniert das aktuell nur unter Windows. [goo.gl/AQBgGU] Flash: In den letzten Jahren ging es mit Flash kontinuierlich bergab. Moderne Webtechniken funktionieren in Browsern schlicht sicherer und performanter. Im Juli hat Adobe nun das End-of- Life von Flash angekündigt: Ende 2020 wird Flash nicht mehr vertrieben und erhält auch keine Updates mehr. [goo.gl/vzUfbH] WEBSTANDARDS / W3C CSS…

01 HYDROGEN ONE Der amerikanische Hersteller RED war bisher eher für hochwertige Digitalkameras bekannt. So setzen große Film- und Fernsehproduktionen auf RED, etwa für Guardians of the Galaxy Vol. 2 oder Mr. Robot. Im Juli kündigte das Unternehmen sein erstes Smartphone an: das Hydrogen One – nach eigener Aussage die erste „holographic media machine” für die Hosentasche. Das 5,7-Zoll-Display soll 3D-Inhalte darstellen können, ohne dass Sie dafür eine 3D-Brille benötigen. Das macht sich auch im Preis bemerkbar. Derzeit können Sie das Smartphone für 1.200 US-Dollar (Aluminium) bzw. 1.600 US-Dollar (Titan) vorbestellen. Weitere Spezifikationen hat das Unternehmen bisher zwar nicht veröffentlicht. Allerdings konnte sich der YouTuber Marques Brownlee mehrere Protoypen ansehen. Demnach sei der 3D-Effekt beim aktuellen Stand der Prototypen zwar nicht perfekt, aber dennoch beeindruckend. Bei den Preisen empfiehlt es…

Wer sich mit dem Thema Barrierefreiheit im Internet beschäftigt, kommt an den WCAG 2.0 (Web Content Accessibility Guidelines) des W3C nicht vorbei. In Deutschland gilt zwar die relativ kompakt formulierte BITV 2.0, der grundsätzliche Aufbau der BITV wurde aber von den WCAG übernommen [goo.gl/Aqmwx6]. Der weitaus größere Teil der WCAG hingegen – Erläuterungen, Empfehlungen, Techniken, Beispiele, Glossar, weiterführende Quellen und konkrete Failures (Verstöße) – wurde nicht übernommen. Wobei das auch gut ist, denn dieser umfangreichere Part der WCAG entwickelt sich ständig weiter, weshalb er auch (bis auf die expliziten Richtlinien und Failures) keinen rechtsverbindlichen, normativen Charakter hat. Allerdings gibt es die erweiterten Informationen nur auf Englisch, was an sich schon eine Barriere ist – und in der Realität unter Experten tatsächlich zu massiven Diskussionen führt, was im Einzelfall genau gemeint…

Um die Reichweite und Möglichkeiten von Storys einzuschätzen, brauchen Sie sich nur einmal die Nutzerzahlen anzuschauen. Snapchat bringt es mittlerweile auf über 166 Millionen, Instagram Stories sogar auf mehr als 250 Millionen täglich aktive Nutzer. Diese beiden Plattformen sind die populärsten und aktivsten für das neue Format. Hier werden richtige Geschichten erzählt und nicht nur einzelne Videos und Fotos veröffentlicht. Die Facebook Stories stehen allen 2 Milliarden aktiven Nutzern zur Verfügung, wobei das Unternehmen derzeit die Nutzung dieser Funktion nicht in Zahlen runterbricht. Sie ist aber nicht annähernd so hoch wie auf Instagram oder Snapchat. In einer ähnlichen Grö- ßenordnung wie Instagram Stories bewegt sich der Whats- App-Status, der ebenfalls von 250 Millionen Nutzern täglich verwendet wird. Er bietet ähnliche Möglichkeiten wie die anderen Plattformen, wobei der Begriff Status anstelle…

Ein Prototyp verknüpft auf dem Weg zu einem fertigen Produkt eine Design-Idee mit der gewünschten Handhabung. Tools wie Adobe Experience Designer oder Sketch versprechen schnelle Ergebnisse auf der Basis grafischer Entwicklung. Dabei bleibt es immer ein wenig schwierig, komplexe Interaktionen und Ereignisse abzubilden, die über das Abspielen verschiedener Bilder im Sinne einer einfachen Diashow hinausgehen. Framer wagt den Schritt in komplexere Gefilde auf der Basis von schnell erlernbarem Programmcode. FRAMERJS WIRD ZU FRAMER STUDIO WIRD ZU FRAMER Mitte 2014 implementierte das Framer-Team die zuvor reine Javascript-Bibliothek FramerJS in „Framer Studio”, das nun nur noch „Framer” heißt [framer.com]. Mit seinen Wurzeln in der gleichen Technologie, die auch Webseiten und -apps befeuert, verwundert es nicht, dass das Coding in Framer eine entscheidende Rolle einnimmt. Die weiterhin gepflegte Bibliothek FramerJS ist naturgemäß plattormunabhängig…

Es gibt jede Menge Initiativen, Spiele und Gadgets, die bereits Kindern das Programmieren näherbringen möchten. Die folgenden Spiele beginnen recht einfach und sind für Kinder und Jugendliche geeignet. Andere Spiele haben ein deutlich höheres Niveau und richten sich an fortgeschrittene Programmierer. LIGHTBOT Bei Lightbox steuern Sie einen kleinen Roboter mit dem Ziel, auf allen blauen Feldern das Licht einzuschalten. Dazu können Sie vorwärtsgehen, sich drehen, springen und eben das Licht einschalten. Im Laufe der Level kommen neue Funktionen hinzu, etwa Prozeduren, Schleifen oder Bedingungen. Dadurch, dass Sie mit Icons programmieren, ist das recht übersichtlich und trainiert programmatische Grundlagen. Dementsprechend richtet sich Lightbot an Kinder ab 9 Jahren, eignet sich aber auch für erwachsene Anfänger. Das Spiel ist für iOS, Android, Windows und Mac verfügbar und kostet zwischen 3 und 5…

Genau mit diesen Fragen beschäftigte sich der Entwickler Roger Wang im Jahr 2011 am Intel Open Source Technology Center. Er schrieb das Modul „node-webkit” (später „NW.js”) für Node.js, mit dem die Browser-Engine WebKit in Node.js-Anwendungen integriert werden konnte [nwjs.io]. Durch diese Integration war es erstmals möglich, Desktop-Anwendungen mithilfe moderner Web-Technologien zu entwickeln. Einer der Mitarbeiter aus Wangs Team, der Student Cheng Zhao, wechselte später zu GitHub, wo er an der Entwicklung des Text- Editors „Atom” beteiligt war [atom.io]. Dieser basierte zunächst auf dem „Chromium Embedded Framework” und sollte auf „node -webkit” portiert werden. Während der Arbeiten stellte sich jedoch heraus, dass die Architektur von „node-webkit” einige Schwächen aufwies, welche die Portierung erschwerten. Aus diesem Grund entschied sich das Atom-Team, ein neues Framework zu entwickeln, das die Vorteile von „node-webkit” mit…

VIDEO Browser Security in 2017. Johann Hofmann, Firefox-Entwickler bei Mozilla, gibt Ihnen einen Überblick, wie Sie Ihre Websites sicherer machen können. [goo.gl/bMbfxd] JavaScript engines – how do they even? Franziska Hinkelmann ist Entwicklerin bei Googles-V8-Team und erklärt in dieser Session die Grundlagen einer JavaScript Engine. [goo.gl/d3S4nQ] Storytelling in JavaScript. Sarah Drasner demonstriert mit vielen Beispielen, wie JavaScript helfen kann, Benutzer geschickt zu führen und emotional zu binden. [vimeo.com/217698742 Hacking the Visual Norm. Nadieh Bremer zeigt, wie Sie mit der JavaScript-Bibliothek D3.js auch ungewöhnliche Datenvisualisierungen umsetzen können. [vimeo.com/217530040] Composing Bach Chorales Using Deep Learning. Feynman Liang bringt einem neuralen Netz bei, eigene Kompositionen im Stil von Bach zu erzeugen. [goo.gl/8MTQHu] Nicolai Schwarz, Autoreninfos auf Seite 3 Twitter: @textformer…

Rund 1,2 Millionen Zugriffe und Hunderttausende Suchanfragen verzeichnet die offizielle Website der Stadt Wien jeden Monat. Dort absolvieren die Bürger virtuelle Amtswege, suchen nach diversen Informationen oder nutzen die Online-Services der Stadt. Immer häufiger geschieht dies von mobilen Endgeräten aus. Die Stadt reagiert auf diese Entwicklung mit Inhalten, die sich an das jeweilige Endgerät anpassen. Die Interaktion über soziale Medien und das frühe Experimentieren mit neuen Kommunikationska nälen sollen den Dialog mit der Stadt für die Wienerinnen und Wiener vereinfachen. Seit dem Frühjahr 2017 testet die Stadt Wien auch einen eigenen Chatbot, der den Namen WienBot trägt. Ein Chatbot ist ein textbasiertes Computerprogramm, das die Kommunikation zwischen zwei Menschen simuliert. Das Besondere: Der Chatbot ist kein Mensch, sondern eine Applikation, die auf künstlicher Intelligenz basiert. Immer mehr Unternehmen setzen auf…

Seit 2001 arbeitet die gemeinnützige Organisation Creative Commons (abgekürzt CC, deutsch: schöpferisches Gemeingut) daran, einfache Lizenzverträge für u.a. Bilder, Texte und Musik zu erarbeiten und zu verbreiten. Diese Lizenzen sollen kreativen Menschen helfen, Nutzungsrechte für ihre Werke auf einfache Weise zur Verfügung zu stellen. So entstehen legale und freie Werke, die auf dem Grundsatz „Sharing is Caring” basieren. Der Urheber entscheidet mit einer CC-Lizenz, dass sein Werk unter den angegebenen Bedingungen genutzt werden kann. Andere dürfen das Werk für ihre Zwecke einsetzen, solange sie diese Bedingungen berücksichtigen. Die CC-Lizenzen stellen also Hinweise und Nutzungsbedingungen für urheberrechtlich geschützte Werke dar. Diese Lizenzen sind Rechtstexte, die auch Laien einfach und unkompliziert weiterhelfen sollen, urheberrechtlich geschütztes Material rechtssicher zu verwenden. Sie gewähren meist mehr Freiheiten, als es das Urheberrecht normalerweise erlauben würde. Doch…

Die Veröffentlichung von jQuery 2006 durch John Resig hat die Frontendwelt um Lichtjahre nach vorne katapultiert. Damals war der Internet Explorer 6 noch der beherrschende Browser, und Firefox grub ihm langsam das Wasser ab. Beide ließen sich aber nicht einheitlich programmieren: Der IE bot noch einige proprietäre Schnittstellen aus grauer Vorzeit, während der Firefox diese Dinge schon gemäß neueren W3C-Standards umsetzte. Prominente Beispiele waren das Navigieren im DOM, das Event- Handling oder AJAX. jQuery harmonisierte das alles unter dem Dach einer wunderschönen API, bei der man mit dem DOM via CSS-Selektoren interagierte und die auf „Method-Chaining” und „Method Patterns” setzte. Außerdem öffnete jQuery das Web der noch jungen Gruppe der Motion Designer. Heute, elf Jahre später, sind nicht W3C-konforme Browser von der Bildfläche verschwunden, und die aktuellen Browser Bugs sind…

EINEN JOB, DER ZU MIR PASST. ADÄQUATE BEZAHLUNG. FÜR FESTE UND FREIE DESIGNERDOCK ist die größte Personalvermittlung für die Kommunikationsbranche im deutschsprachigen Raum. Gesucht werden qualifizierte Front- und Backend-Programmierer, Interface- und Motiondesigner bis zu Interactive- oder Online AD sowie digital Konzepter und Projektmanager. Unsere Kunden sind namhafte Agenturen und Unternehmen. Wir bieten eine kostenfreie Aufnahme in die Kartei. Für die Vermittlung von Freelancer-Jobs fällt eine Provision in Höhe von 10 Prozent an. Die Vermittlung in eine Festanstellung ist für den Kandidaten kostenfrei. Bewerbungsformular, Jobs und alle Informationen unter www.designerdock.com. Für Ihre Karriere – den passenden Job: www.designerdock.com/online oder mobile.designerdock.com. Wir freuen uns auf Ihre Bewerbung – gerne auch initiativ.…