Blog - insertEFFECT - insertEFFECT https://www.inserteffect.com Wed, 28 Sep 2016 05:06:08 +0200 Joomla! - Open Source Content Management de-de Wir machen Nürnberg zum Experimentierfeld - mit den Future Mobility Days 2017 https://www.inserteffect.com/blog/future-mobility-days-vorstellung https://www.inserteffect.com/blog/future-mobility-days-vorstellung Future Mobility Days Hackathon

Kaum ein Tag vergeht in dem nicht eine Meldung in den Medien zum Thema Zukunft der Mobilität erscheint. In Deutschland gibt es dazu schon ein paar Modellregionen. Die Metropolregion Nürnberg ist jedoch in diesem Bereich noch ein unbeschriebenes Blatt - Bemühungen in diese Richtung gibt es aber. Das wollen wir gemeinsam mit Interessierten unterstützen und laden am 10. und 11. Februar 2017 zu den Future Mobility Days nach Nürnberg ein.

Die Vision der Future Mobility Days sind Städte, die menschenfreundlicher, sauberer, grüner und lebendiger sind als heute. Deshalb stellen wir uns den Herausforderungen vernetzter Mobilität. Bei dem zweitägigen Event wird durch das BarCamp der Wissensaustausch gefördert, mit der Design Thinking Jam Prototypen vernetzter Mobilität gebaut und während des Hackathons digitale Lösungen entwickelt.

FMD JamMit den Future Mobility Days wollen wir Mobilitätsanbieter, Dienstleister, Verkehrsplaner, Stadtplaner, Politiker, führende Köpfe der Wirtschaft, Programmierer, Digitalisierungsexperten, Design Thinker und Visionäre ansprechen. Wir wollen dabei auch Akteure aus der Metropolregion gewinnen und miteinander vernetzen, damit Mittelfranken nicht länger ein weißer Fleck auf der Mobilitätslandkarte bleibt.

 

Warum wir das tun?

Seit der ersten Mobile First Night im Jahr 2012 beschäftigen wir uns immer intensiver mit dem Thema Zukunft der Mobilität, nicht nur bei diesem Event. Seit Januar 2016 haben wir uns als mobile Software Spezialisten ganz dem Thema “new mobility” verschrieben. Inspiration für die Future Mobility Days holten wir uns bei unterschiedlichen Events, wie dem Future Mobility Camp, dem Hackday der DB und dem CycleHack Nürnberg.

Wir sehen uns dabei in der Rolle eines Initiators, der die Akteure aus der Region und darüber hinaus vernetzt, um das Thema neu zu denken und in der Metropolregion Nürnberg voran zu treiben. Denn wir sind der Überzeugung, dass wir nur gemeinsam die Zukunft gestalten können und dabei Einzelinteressen zurücktreten sollten. Durch den Überregionalen Austausch in D/A/CH wollen wir voneinander lernen und uns gegenseitig inspirieren.

 

Was Ihr erwarten könnt?

Durch viel Interaktion und die Kombination innovativer Methoden entstehen digitale Lösungsideen für die Zukunft der Mobilität. Die drei Eventbausteine der Future Mobility Days  sind miteinander verknüpft. Wir sind überzeugt, dass sie eine nie dagewesene Dynamik an Ideen und Netzwerken hervorbringen:

BarCamp - Die Unkonferenz zur Zukunft von Mobilität
Design Thinking Jam - Gemeinsam Lösungsideen zu vernetzter Mobilität entwickeln.
Hackathon - Digitale Lösungen für Mobilität umsetzen.

FMD ExpAreaAuch beim Rahmenprogramm wollen wir neue Wege gehen und die Teilnehmer sowie die Öffentlichkeit einladen, auf einer Erlebnisfläche neue Formen der Mobilität nicht nur kennen zu lernen, sondern auszuprobieren. Dafür sind wir auf der Suche nach StartUps und innovativen Fortbewegungsmitteln. Wer einen Tipp hat, wendet sich bitte an info@futuremobilitydays.de

Zum Abschluss der Veranstaltung feiern wir mit allen Campern, Jammern und Hackern eine Award-Party, bei der Preise in unterschiedlichen Kategorien vergeben werden und in lockerer Atmosphäre genetzwerkt werden kann.

 

 

Wir suchen noch Mitmacher!

Solch ein Event braucht natürlich Förderer und Unterstützer! Wir freuen uns daher über die Kooperation mit Martin Randelhoff von Zukunft Mobilität für das Future Mobility Days BarCamp. Er bringt nicht nur sein Netzwerk vom Future Mobility Camp mit ein, sondern wird auch beim BarCamp eine Session halten und uns sicherlich inspirierenden Input liefern.

Wir suchen natürlich auch noch Sponsoren, Daten- sowie Hardware-Partner für den Hackathon und freuen uns über Empfehlungen an info@futuremobilitydays.de

 

Anmeldung

Ab Ende September starten wir die Anmeldung zu BarCamp & Design Thinking sowie Hackathon der Future Mobility Days mit einem Early-Bird-Spezial! Tragt Euch auf www.futuremobilitydays.de in unseren Newsletter ein und bleibt auf dem Laufenden! Wir sind gespannt auf Eure Session-Vorschläge und HackIdeen.

 

Lasst uns gemeinsam Zukunft gestalten!
Wir freuen uns auf Euch,
das Future Mobility Days Team

]]>
halil@insfx.com (Andreas Fehr) Blog Fri, 16 Sep 2016 12:17:33 +0200
Nicht waafn sondern machen – beim 2. CycleHack Nürnberg https://www.inserteffect.com/blog/cyclehack-nuernberg https://www.inserteffect.com/blog/cyclehack-nuernberg

 Vom 24. - 26. Juni kamen auf der ganzen Welt in mehr als 30 Städten engagierte Radfahrer zusammen um ihre Ideen für ein angenehmeres Fahrradfahren Wirklichkeit werden zu lassen.

Auch Nürnberg war wieder Teil der globalen CycleHack* Community. Mit diesem Event habe ich kurz vor meinem Einstieg als Lead Service Designer bei insertEFFECT meinen neuen Chef in einer ganz anderen Rolle erleben dürfen. Veranstaltet habe ich das Event im Namen von BLUEPINGU e.V., einem Verein, der sich für nachhaltig Leben in Franken engagiert und bei dem ich ehrenamtlich aktiv bin. Benno war nicht nur offizieller Vertreter des Hauptsponsors des zweiten CycleHack Nürnberg, sondern auch mein Co-Moderator.

 

Kids CycleHack

kids hackDa am Freitagnachmittag immer das Kids Lab vom FabLab Nürnberg veranstaltet wird, nutzten wir die Möglichkeit, auch mit den anwesenden Kindern über Ihre Ideen sowie Hindernisse beim Radfahren zu sprechen und durch Lego-Prototypen erlebbar zu machen. Zwar waren wegen des tollen Freibadwetters nur zwei Kinder da, aber diese waren so Feuer und Flamme, dass es nächstes Jahr auf jeden Fall wieder einen Kids-CycleHack geben wird. An dieser Stelle herzlichen Dank an Jürgen Bayernköhler für die weltklasse Betreuung des Kids CycleHack!

 

Kick-Off und Problemraum erkunden

testfahrtBeim 2. CycleHack Nürnberg hatten die Teilnehmer nur 28 Stunden Zeit um Probleme und Hürden beim Radfahren zu entdecken, Lösungsideen zu entwickeln, auf der Straße zu testen und ihre Lösungskonzepte zu verfeinern. Gemeinsam begrüßten Benno und ich am Freitagabend knapp 20 TeilnehmerInnen im FabLab Nürnberg. Als Einstieg gab es zwei Impulsvorträge, um in das Thema Rad fahren aus verschiedenen Perspektiven einzutauchen. Matthias Hueber von iBike Nürnberg stellte die Entwicklung von Mobilität in urbanen Räumen vor und zeigte innovative Lösungen für fahrradfreundliche Städte. Danach berichtete Hendrik von Relo, wie sie auf die Idee mit dem E-Steckantrieb kamen, wie das System funktioniert und welchen Herausforderungen sie sich als StartUp stellen müssen. Im Anschluss konnten die CycleHacker neue Mobilitätsansätze wie ein E-Einrad, den Ansteckelektromotor vom Nürnberger StartUp Relo oder dem Lastenfahrrad Fridolin von iBike Nürnberg selbst testen. Dieses Setting war für die Teilnehmer sehr inspirierend und wir sagen herzlich Danke an die Referenten und Testgeräteinhaber!

fightclubZum Abschluss des Abends tauchten wir dann gemeinsam in international und lokal gesammelte Barrieren für das Fahrradfahren ein. In einer Art “Fight Club” diskutierten die CycleHacker Hintergründe und versteckte Bedürfnisse von Barrieren, um auf das tatsächliche Problem oder einen echten „need” zu stoßen.

 

 

 

Mit den Händen Denken und experimentieren

feedbackrundeDer Samstagvormittag stand ganz im Zeichen der Ideenentwicklung zur Lösung von Problemen, die wir am Freitagabend gemeinsam identifiziert hatten oder Ideen, die CycleHacker schon länger in sich trugen. Anstatt die Lösungskonzepte totzudiskutieren, wurden diese in einem ersten Schritt durch Paper-Prototypen und Lego erlebbar gemacht, um sich untereinander ein besseres Feedback geben zu können. Nach dem Mittagessen wurde das Feedback von den Teams aufgegriffen und ihre Lösungsideen zu erlebbaren und somit testbaren Prototypen weiterentwickelt. Dann ging es zum Quicktest auf die Straßen von Muggenhof, um sich von potenziellen Nutzern ein auf Erfahrung basiertes Feedback abzuholen. Folgende Lösungsideen wurden einem Realitätscheck unterzogen:

Plug & Tug
An steilen Bergen verlassen einen Radfahrer schnell die Kräfte. Wie kann man ohne einen Elektromotor dieses Hindernis leichter überwinden? Dazu entwickelte das Team ein einfaches “Mitnahme” System, bei dem Kraftfahrer die Radfahrer mit modularen und temporären Hilfsmitteln den Berg mit hochziehen. Das Video vom Street-Test findet Ihr hier auf Facebook. Mehr Infos zum Projekt gibt es hier: http://www.cyclehack.com/catalogue/plug-tug-free-towing-service

Cycle Belt
Was tun, wenn man sein Fahrrad des Öfteren längere oder mehrere Treppen hochtragen muss? Für dieses Problem entwickelte das Team ein einfaches Tragesystem, das ans Rad auch nur temporär angebracht werden kann. Mehr Infos zum Projekt gibt es hier: http://www.cyclehack.com/catalogue/cycle-belt

LED Licht für Radanhänger
Oftmals sind Radanhänger unbeleuchtet und werden daher in der Dämmerung oder nachts schlecht gesehen. Die Lösung könnte ein LED-Licht-Klicksystem sein, das man leicht selber bauen kann (wenn man ein FabLab zur Hand hat). Mehr Infos zum Projekt gibt es hier: http://www.cyclehack.com/catalogue/led-light-for-child-bike-trailer

CycleHack Trails
Oftmals sind Radwege und Beschilderungen nicht die einfachste oder direkteste Route zwischen zwei Orten. Mit dem analogen und digitalen CycleHack Trails kann eine örtliche Radfahrer-Community leicht Abhilfe schaffen und alternative Routen in der Stadt oder zu Ausflugszielen selbst beschildern. Mehr Infos zum Projekt gibt es hier: http://www.cyclehack.com/catalogue/cyclehack-trails

Phoning in the wind
Wer beim Radfahren über ein Headset telefoniert, kennt das Problem der störenden Windgeräusche. Das Team hat hier einen einfachen LifeHack entwickelt, in dem das “Tote Katze” - System aus dem Fernsehtechnikbereich auf ein Headset übertragen wurde. Mehr Infos zum Projekt gibt es hier: http://www.cyclehack.com/catalogue/dead-cat

Cycle Guerilla Kit
Das Team nahm sich gleich verschiedene Barrieren zur Lösung vor und entwickelte einen Hack-Tool-Koffer, mit dem Radfahrer spontan Hindernisse beseitigen können, oder auch das Leben anderer Radfahrer erleichtern können. Sozusagen ein permanentes CycleHacking. Mehr Infos zum Projekt gibt es hier: http://www.cyclehack.com/catalogue/cycle-guerrilla-kit

 

Quick-Test auf der Straße - Ideen erleben

streettestDie Meinung der spontanen Tester fiel sehr unterschiedlich aus. Manche Ideen, wie die LED-Lichter für Radanhänger oder das Guerilla Kit wären am liebsten von den Testpersonen sofort genutzt oder gekauft worden, bei anderen Ideen, wie dem Vorhaben Plug&Tug sind noch rechtliche und technische Hürden zu meistern, sollte man die Idee umsetzen wollen. Es zeigt sich, auch ein unvorbereiteter und spontaner Quick-Test auf der Straße liefert durch die Interaktion mit einem Ideen-Prototypen hilfreiche Informationen, die bei der Entwicklung im stillen Kämmerlein so nicht zutage gefördert worden wären!

Zum Abschluss luden alle Hacker ihre Ergebnisse, angereichert mit ihren Erfahrungen aus dem Street-Test auf die CycleHack-Plattform hoch. Die weltweit entwickelten Ideen stehen unter Creative Commons zur freien Verwendung oder Weiterentwicklung zur Verfügung. So soll ein Austausch unter den Radfahrern gefördert werden und ein Beitrag zu nachhaltigeren, fahrradfreundlicheren Städten geleistet werden. Ihr könnt Euch die Ergebnisse aus Nürnberg und den anderen Städten hier ansehen: http://www.cyclehack.com/location/nuremberg

 

Wir sagen Danke!

cyclehacker ngbBenno und ich möchten uns noch einmal bei allen Teilnehmern bedanken, die uns nicht nur mit ihrer Anwesenheit, sondern auch mit einer Fülle an kreativen Ideen beehrt haben. Wir sind überwältigt von Eurem Engagement, Ideen, Prototypen und dem Spaß, den wir zusammen hatten!

Ein extra Dankeschön geht an das Team des FabLab Nürnberg, ohne welches die mannigfaltige und vielgestaltige Umsetzung verschiedenster Ideen nicht möglich gewesen wäre. Ein besonderer Dank gilt natürlich dem Team von BLUEPINGU e.V., das dieses Format nach Nürnberg gebracht hat!

 

RadioZ-Beitrag über den CycleHack von Sebastian Pallek 

Hier anhören: Soundcloud

 

Mein persönliches Fazit

Der zweite CycleHack und vor allem die Menschen, die dabei waren, haben mich wieder einmal unglaublich elektrifiziert! Ich bin immer wieder erstaunt, wie schnell man mit der iterativen Design Thinking Methode, seiner Nutzerfokussierung und einem kreativen Setting auf echte Probleme oder echten „need“ stößt. Durch das rapid Prototyping und das erlebnisbasierte Feedback werden Lösungsideen schnell auf einen anderen Level gehoben und falsche Annahmen sofort sichtbar! Durch die Ausarbeitung in einer Lo-Fi-Variante traut man sich eher, seine Idee zu verwerfen oder in Teilen zu „zerstören“ und zu optimieren. Das Denken mit den Händen und ausprobieren beflügelt die Menschen und bringt weit bessere Ergebnisse, als wenn man versucht, typisch deutsch, alles erst einmal durchzudenken. Der Raum und das spielerische Herangehen fördern die Kreativität. Durch eine lockere (um nicht zu sagen, spaßige) Atmosphäre und die Design Thinking Methoden schafft man Dinge in unglaublich kurzer Zeit! Mir gefällt am CycleHack besonders gut, dass man nicht über Probleme spricht, sondern sie durch Experimentieren versucht zu lösen!

Das ganze dann noch eingebunden in eine globale Gemeinschaft, die offen ist, gerne Wissen und Erfahrungen teilt und sich gegenseitig unterstützt, hat gewisses Suchtpotenzial!

Daher freue ich mich schon jetzt auf den CycleHack Nürnberg 2017!
Keep on hacking!
Andreas

* Das Wort Hack kommt aus dem Englischen und wurde zuerst im IT-Kontext verwendet für Treffen von Interessierten, die in kurzer Zeit unkonventionelle Lösungen für Software entwickelt haben. Dieser Ansatz von den Begründern des CycleHack mit Design Thinking Methoden auf die Beseitigung von Barrieren beim Radfahren angewendet. Der CycleHack will einen wichtigen Beitrag zu mehr Nachhaltigkeit im Bereich Mobilität leisten und den Austausch zwischen Radenthusiasten auf der Welt fördern.

P.S.: Einen tollen Film zu Design Thinking findet Ihr hier in englischer Sprache: designthinkingmovie.com

 

]]>
halil@insfx.com (Andreas Fehr) Blog Tue, 09 Aug 2016 13:11:50 +0200
Smartwatches - Was taugen sie? Eine gefühlte Wahrheit https://www.inserteffect.com/blog/smartwatches-was-taugen-sie-eine-gefuehlte-wahrheit https://www.inserteffect.com/blog/smartwatches-was-taugen-sie-eine-gefuehlte-wahrheit

Die kleinen Teile, futuristisch am Handgelenk zu tragen, sind ja zur Zeit in aller Munde. Grund genug, sich als Designer und potenzieller Träger zu fragen: Was habe ich davon und welche Anwendungsfälle machen Sinn? Daher habe ich einfach mal getestet - am Beispiel der Android LG G Watch (http://www.lg.com/de/wearables/lg-G-Watch).

Zunächst einmal zur Hardware: Die “Uhren” sind ausgestattet mit allerlei Sensoren, die darauf warten, gewinnbringend eingesetzt zu werden. Die Ausstattung ist allerdings unterschiedlich. Manch einer, der seine Smartwatch zum Sport-Supervisor machen will, wird auf den Pulsmesser bauen. Einem anderen genügt es vielleicht, dass man mittels Spracherkennung schnell mal eine WhatsApp-Message beantworten kann. Das Mikrophon empfängt solche Spracheingaben. Gyroskop und Beschleunigungssensor dienen zur Positions- und Richtungsbestimmung. Durch Handauflegen auf den Lichtsensor bringt man die Smartwatch zur Ruhe.

Die Herausforderung beim Konzepten für die Smartwatch liegt im Finden passender Anwendungsfälle. Insbesondere, da sie technisch gesehen lediglich der verlängerte Arm des Smartphones ist. Sie ist kein Standalone-Device, sondern zeigt nur Inhalte an, die sie von den verbundenen Smartphone-Apps erhält. Ist das Handy nicht in Bluetooth-Reichweite, dann funktioniert auch ein Großteil der Features der schlauen Uhr nicht.
Macht es nun Sinn, Inhalte auf der Smartwatch verfügbar zu machen, die danach eine Interaktion auf dem Smartphone erfordern? Vielleicht. Es kommt darauf an. Wenn es aber cool sein soll, darf die Transformation des Digitalen nicht um der Transformation Willen geschehen.

Das Interface ist einfach zu bedienen. Auch, weil Google strenge Guidelines veröffentlicht hat. Es werden nur Inhalte angezeigt, die in der Situation für den User Sinn machen, d.h.

  • Inhalte werden kontextsensitiv, abhängig von Ort, Zeit und Aktivität angezeigt oder von verknüpften Apps auf die Uhr gesendet (Bridged Notifications). Diese können bei Bedarf aber auch blockiert werden.

  • Die Inhalte werden in Form von Cards angezeigt und enthalten schnell erfassbare, reduzierte Informationen, die als Preview dienen.

  • Sie erscheinen im Context Stream, einer vertikalen Liste, die man durchwischen kann. Wird eine Card nicht benötigt, kann sie nach rechts weggewischt werden. Nach links wischen öffnet die einzelne Card, deren Details und verbundene Interaktionsmöglichkeiten.

Navigation auf dem Wear Device; Quelle: https://developer.android.com/design/wear/index.html. Hier finden sich auch alle Design Guidelines zum Nachlesen.

Die gesamte Navigation bewegt sich also entlang einer vertikalen Hauptachse und einer horizontalen Detailansicht. Easy.

Wichtig zu verstehen ist, dass die auf der Smartwatch dargestellten Inhalte vorrangig auf “Information” und gegebenenfalls “Reaktion” und nicht auf “Aktion” ausgelegt sind. Das lässt sich am besten an den gängigsten mitgelieferten Anwendungen illustrieren. “Ab Werk”, verbunden mit den Google Services und der Android Wear App kommen E-Mail, SMS, Anrufe, Notizen, Kompass, Kalender, Stoppuhr/Timer, Navigation, Musikplayer und der Schrittzähler Fit auf die Uhr.
Die von ihnen ausgehenden Notifications erhält der Nutzer, auf Wunsch mit Vibration, auf die Uhr und muss so nicht das Handy aus der Tasche kramen, um zu wissen, was sich Neues, z.B. im Terminkalender, getan hat. Ein Blick auf die Uhr ist im Alltag weniger störend - gerade wenn man sich in Gesellschaft befindet.

Bei der Beantwortung einer SMS oder der Eingabe eines Navigationsbefehls müssen aber auch immer die Kontextbedingungen stimmen: Der User darf sich nicht in zu lauter Umgebung befinden, bei sensiblem Inhalt muss er unter Ausschluß von neugierigen Mithörern agieren und die Spracherkennung muss auch tatsächlich funktionieren (Was insbesondere bei Eigennamen oft nicht der Fall ist.) Auch die Anrufannahme ist eine gute Idee, allerdings nur, wenn man gerade ein Headset aufhat, denn zumindest die LG G hat keinen Lautsprecher. Diese Einschränkungen und die Tatsache, dass viele Dienste aktiv auch gar nicht abrufbar sind (WhatsApp zum Beispiel) machen das Device zu einem oft nur passiv genutztem Gadget.
Anwendungen wie der Musikplayer, der nicht notwendigerweise mit Sprachsteuerung bedient werden muss, sondern mit einem einfachen Tap auf den Play Button gestartet wird, sind wenig störanfällig und hier kann die Smartwatch tatsächlich brillieren. (Man gelangt zur entsprechenden “Card” durch Tap auf den Hintergrund des Startscreens und über das sich dann öffnende Menü).

Einen echten Mehrwert bietet die Smartwatch, wenn ihre eingeschränkte Funktionalität nicht als Nachteil, sondern als Vorteil betrachtet wird und der Kontext, in dem bestimmte Apps verwendet werden, immer mitbedacht wird. Klar ist es nett und bequem, Notifications auf die Smartwatch zu bekommen. Oder wenn es gelingt, die Routen-Navigation anzustoßen. Im Grunde genommen würde man dies aber lieber mit dem Handy tun, wenn man nicht gerade in der anderen Hand ein Getränk oder den Fahrradlenker hätte.
Wenn man nun Situationen betrachtet, in denen es nicht nur nicht bequem, sondern schlicht nicht möglich ist, das Smartphone bzw. beide Hände zu nutzen, also keine hinreichende Bedienung, sondern eine notwendige Bedingung für den Gebrauch vorliegt, und wenn die Umgebungsfaktoren stimmen, wird es spannend. Insbesondere, wenn man die umfänglichen Sensorfunktionalitäten der Wear Devices mit einrechnet. Was ist zum Beispiel mit einem automatischen Telefonnotruf, der sich aus unregelmäßigem Puls und fehlender Bewegung ergibt? Oder der Bezahlung im Lieblingsgeschäft per Fingerabdruck-Sensor? Eine Zeiterfassungs-App, die merkt, wann man das Büro, die Baustelle, die Klinik usw. betritt und automatisch fragt, auf welches Projekt zum Beispiel gebucht werden soll? Wenn hier eng mit Kunden und Nutzern zusammengearbeitet wird, dann kann eine Smartwatch mehr als ein Gadget sein. Eine interessanter Versuch in diese Richtung ist zum Beispiel FitBit: Ein Wearable, das den Schlaf überwacht, um Prognosen des Auftretens von Schüben bei schizophrenen Patienten vorauszusagen (http://www.wired.co.uk/news/archive/2015-05/14/schizophrenia-relapse-alert-system-fitbit).

Ein Rezept für gute Smartwatch-Anwendungen gibt es nicht. Aber wir wissen, wo wir einkaufen müssen: Beim Nutzer, beim Kontext, in der Einfachheit und beim technologischen Potential, das in den (Sensor-)Daten steckt. Bis dahin können wir “Deadly Spikes” spielen ;)

Solltet Ihr mehr über das Thema Smartwatch Entwicklung wissen wollen, schaut einfach mal vorbei oder schreibt uns!

]]>
halil@insfx.com (Maja Bubel) Blog Tue, 09 Jun 2015 11:59:26 +0200
Wir sind auf der Web Experience Arena @ CeBIT https://www.inserteffect.com/blog/wir-sind-auf-der-web-experience-arena-cebit https://www.inserteffect.com/blog/wir-sind-auf-der-web-experience-arena-cebit

5 Jahre ist her, dass wir das letzte mal auf der CeBIT eine Session gehalten haben. Damals hieß das Veranstaltungsformat noch WebCiety. Halil und Nina hielten damals eine Session zum Thema "Live Usability Test der mobilen Webseite der Deutschen Bahn".

cebit 2015

2015 heißt die Konferenz Web Experience Arena. Am kommenden Freitag, den 20.3. werden Benno und Nina wieder vor Ort sein und eine Session mit dem Thema "Vom Schreibtisch in die Hosentasche ans Handgelenk - Ein Reisebericht über die Besteigung des Mobile-First-Gipfels mit Tipps zum Bepacken des Smartwatch-Content-Rucksacks." halten. Wir nehmen außerdem am Expert-Panel: Mobile First & die Implikationen für die Digital-Strategie teil. Wer uns treffen will, die Session findet am Freitag von 11:20 - 12:00 Uhr statt.

]]>
halil@insfx.com (Nina Wieland) Blog Tue, 17 Mar 2015 15:13:03 +0100
Linksammlung rund ums Thema Web, Web-Design etc. https://www.inserteffect.com/blog/linksammlung-rund-ums-thema-web-web-design-etc https://www.inserteffect.com/blog/linksammlung-rund-ums-thema-web-web-design-etc

Unser Web-Team hat eine Liste mit Artikeln, Talks, Blogs, Newslettern und Büchern unter anderem zu den Themen Web-Entwicklung, Web Design, JavaScript und Performance zusammengestellt, die man lesen bzw. abonnieren sollte. Darunter sind auch einige ältere Sachen, die unserer Meinung nach ziemlich zeitlos sind und immer noch empfohlen werden können.

 

Artikel

Talks

  • One Web
    Plädoyer von Jeremy Keith, die Trennung von "Mobile Web" und "Desktop Web" aufzugeben und das Web als Ganzes zu begreifen.
  • Mobile First
    Luke Wroblewski fasst die wesentlichen Punkte seiner Idee von "Mobile First" kompakt und unterhaltsam zusammen.
  • Crockford on JavaScript
    Die ultimative Vortragsreihe über die Geschichte von JavaScript.

Bücher und E-Books

Blogs etc.

Blogs und Magazine, die einen Platz im RSS-Reader verdient haben:

Web-Entwicklung und Mobile

CSS

Newsletter

Hier werden wöchentlich interessante/wichtige/heiß diskutierte Links aus der Community gesammelt und per Newsletter versendet. Gibt's natürlich auch als Twitter-Feed.

Natürlich freuen wir uns über weitere Vorschläge, die wir gerne mit in diese Liste aufnehmen.

]]>
halil@insfx.com (Ute Mündlein) Blog Fri, 06 Mar 2015 15:01:49 +0100
Kostenloses Adobe Illustrator-Script zum vereinfachten Export von Grafiken https://www.inserteffect.com/blog/kostenloses-adobe-illustrator-script-zum-vereinfachten-export-von-grafiken https://www.inserteffect.com/blog/kostenloses-adobe-illustrator-script-zum-vereinfachten-export-von-grafiken

Viele Designer kennen es: "Grafiken für die Entwicklung exportieren". Gerade für Android können da bis zu sechs verschiedene Auflösungen für ein Icon anfallen. Aber auch für iOS sind es mittlerweile drei Auflösungen, in denen man die Grafiken bereitstellen muss. Das Problem: Es ist eine mühselige Arbeit, die schnell viel Zeit beanspruchen kann.

Grafiken mit Hilfe bestehender Dienste exportieren

Über Scripte oder Webseiten gibt es bereits die Möglickeit, Grafiken in verschiedenen Auflösung herausrechnen zu lassen. Einen webbasierten Dienst bietet beispielweise der Generic Icon Generator. Man lädt eine SVG-Grafik hoch und kann sich ein ZIP-Archiv herunterladen, das die Grafiken in den verschiedenen Auflösungen enthält. Wir haben den Icon Generator getestet. Allerdings sind wir mit dem Ergebnis nicht ganz zufrieden. Bei den verschiedenen Endgrafiken treten unschöne Interpolationsfehler an den Rändern auf. Das zeigt sich vor allem bei Geräten mit hochauflösenden Displays. Dort kann es den Effekt haben, dass zum Beispiel Icons unscharf aussehen, obwohl sie in der richtigen Auflösung vorhanden sind. Ein weitere negativer Punkt ist das Fehlen einer Auflösung (xxxhdpi).

Beispielgrafik mit Interplationsfehler an den Rändern 

Für Photoshop gibt es ebenfalls verschiedene Wege, Grafiken zu exportieren. Entweder man arbeitet mit Slices oder seit Photoshop CC hat man auch die Möglichkeit, diese über die "Elemente extrahieren"-Funktion automatisch herauszurechnen. Das ist prima, wenn man Icons und Grafiken direkt in Photoshop erstellt. Allerdings ist unser Tool der Wahl Adobe Illustrator und deshalb stellte sich uns die Frage: Wie können wir effektiver Grafiken aus Illustrator exportieren?

Jetzt kommt Magic ins Spiel: AI-Assets für Illustrator

Als Benny bei Katharine bei einem interdisziplinären Projekt zusammen saßen, kamen sie zum Schluss "Das muss doch einfacher geh'n". Bis dato hatten wir den Workaround Illustrator - Photoshop - Illustrator .... Generell ein umständlicher Workflow. Und wie gesagt, brauchen wir eine Lösung, die ein qualitativ hochwertiges Ergebnis liefert.

Beispielgrafik ohne Interpolationsfehler

 

Benny tauschte sich daraufhin mit Roli aus und implementierte kurzer Hand ein Skript für Illustrator. Es gab ein paar Praxistests bei uns im User-Experience-Design-Team mit anschließender Feedbackschleife. Die Zitate von Katharine und Roman sprechen Bände:

Das Illustrator Skript ist wirklich der HAMMER, da es einem die lästige Arbeit abnimmt, Grafiken in allen Auflösungen manuell abzuspeichern: Einfach Speicherort auswählen, Dateinamen eingeben und schon purzeln die Grafiken in den gewünschten Formaten raus. (Katharine)

 Manchmal können ein paar Zeilen Code viel Arbeit ersparen! (Roman)

Deshalb wollen wir es euch nicht vorenthalten. Auf GitHub https://github.com/inserteffect/ai-assets steht es zum Download bereit, inklusive Bedienungsanleitung.

 

Viel Spaß damit!

Nina

]]>
halil@insfx.com (Nina Wieland) Blog Wed, 11 Feb 2015 15:58:14 +0100
Icondesign - Icon ist nicht gleich Icon https://www.inserteffect.com/blog/icon-ist-nicht-gleich-icon https://www.inserteffect.com/blog/icon-ist-nicht-gleich-icon

Gleich mal zu Beginn des Posts eine Frage: Für was könnten folgende vier Icons stehen?

icons 

Und im Kontext der mobilen Webseite des Videoportals Vimeo, der Gmail-App und der Fotoalbum-App?

Icons im App-Kontext

Bei Vimeo steht das Herz-Icon für “Like” und das Papierflieger-Icon für “Share”. In der Gmail-App hingegen wird das Papierfliger-Icon für “Senden” verwendet. Die Fotoalbum-App benutzt das ShareThis-Icon und ein Stern für Favoriten. Nicht selten sieht man allerdings das Herz auch als Symbol für Favoriten. Welches Icon soll man nun für welchen Begriff verwenden?

Gehen wir nochmal einen Schritt zurück. Ein Icon soll laut Definition “eine Information durch vereinfachte grafische Darstellung vermitteln”. Ein Herz, ein Papierflieger, ein Stern sind eine einfache Darstellung. Beim ShareThis-Icon ist es schon etwas schwieriger zu beschreiben, was es ausdrücken soll. Allerdings stellt man fest, dass die Icons, trotz anscheinend einfacher Darstellung, häufig unterschiedlich verwendet werden. Wie schafft man es nun, für den Nutzer Icons zu gestalten, die die Benutzbarkeit einer Anwendung unterstützen?

Tipps aus der Praxis

In einem vergangenen Projekt hatten wir die Aufgabe die Dashboard-Icons der bauen.de Android-App neu zu gestalten. Es galt jeweils ein Icon für folgende Begriffe zu gestalten:

  • Grundstücke

Funktion: Grundstücke suchen

  • Typenhäuser

Funktion: Typenhäuser suchen

  • Merkzettel

Funktion: Merkzettel anzeigen

  • Ratgeber

Funktion: Ratgeber für Hausbau, Ausbau & Renovierung, Neue Energien & Umwelt, … anzeigen

  • Musterhäuser

Funktion: Musterhäuser in einer Kartenansicht anzeigen

  • Hauskataloge

Funktion: Hauskataloge anzeigen

  • Prospekte

Funktion: Prospekte anzeigen

Hinzu kam, dass die alten Icons durch die neuen ersetzt werden sollen. Das heißt, es gibt Nutzer, die die Iconsprache bereits gelernt hatten.

Schritt 1 - Freie Recherche

In einer ersten Phase haben wir erstmal gängige Muster für Icons recherchiert. Also Haus, Lupe, Karten, usw. Ziel war es, für den Nutzer bekannte Icons zu finden. Außerdem gemeinsam mit dem Kunden entschieden, welchen Style die Icons haben sollen. Das heißt, sind die Icons zum Beispiel monochrom oder mehrfarbig, 2D oder 3D. Gepaart wurde diese Phase mit den Google-Vorgaben zu Icondesign. Entscheidend war noch, dass die Icons auf dem Dashboard nicht selbsterklärend sein müssen, da dieses aus Icon und Text besteht.

Schritt 2 - Scribblen

Nach der Recherchephase entschieden wir uns für mehrfarbige Icons in 2D. Die Icons sollten sowohl aus einer Aktion und der dazugehörigen Information bestehen. Wir suchten also Icons zum Beispiel für “Grundstück” und “suchen”. In einer gemeinsamen Scribble-Session entstanden dann erste Entwürfe. In der Phase war uns wichtig, dass wir erstmal nur die Iconsprache und nicht das Design diskutieren. Für die Trennung sprach, dass es oft schwierig ist, den Fokus auf die Iconsprache zu legen, sobald die Gestaltung mit ins Spiel kommt.

scribble icons

Schritt 3 - Iconsprache verfeinern

Die Entwürfe dienten als sehr gute Grundlage, um Nutzer- und Kundenfeedback einfließen zu lassen. Das heißt, wir haben diese unseren Kolleginnen und Kollegen gezeigt und gefragt, was sie darunter verstehen. Nachdem wir dieses Feedback eingearbeitet hatten, gingen die Entwürfe an den Kunden. Dieser gab nochmals Feedback aus Kundensicht:

Es ist gut, dass das Icon unförmig ist und nicht mehr wie ein DIN A4 Papier aussieht. Allerdings hat das Icon für uns zu sehr Ähnlichkeit zu einem Haus- oder Wohnungsgrundriss.

Wir würden uns wünschen, wenn das abgebildete Grundstück im Verhältnis zu weiteren Grundstücks-Parzellen stehen würde, eventuell sogar mit kleinen Details wie eingezeichneten Wegen und Bäumen etc

 

Das „i“ in dem Buchrücken ist ohne die dazu gelieferte Erklärung leider nicht bei jedem gleich ersichtlich gewesen. Eventuell wäre es besser, wenn man das „i“ als extra Icon darüberlegt (wie bei der Lupe). Alternative zum „i“ wäre z.B. auch das „?“.

Dieses nahmen wir auf und setzen es direkt beim Reinzeichnen in Illustrator um.

Schritt 4 - Reinzeichnen

Illustrator ist unser Tool der Wahl, wenn es um Icons geht. Im mobilen Umfeld benötigt man Grafiken für die verschiedenen Auflösungen. Bei iOS ist das eine einfache, doppelte und seit dem iPhone 6 Plus auch eine dreifache Auflösung. Für Android stellt man Grafiken in mdpi, hdpi, xhdpi und xxhdpi bereit. Deshalb haben wir diese als Vektorgrafik angelegt. Ein weiterer wichtiger Punkt ist der Icon-Status, also das Touch-Feedback. Tappt der Nutzer mit dem Finger auf das Display, kann man ihm eine Rückmeldung geben, dass er ein Element ausgewählt hat. Dies erfolgt durch das Anzeigen einer anderen Grafik. 

Touch Feedback

Fazit

Das passende Icon zu finden, ist nicht immer einfach. Vor allem, wenn das Icon selbsterklärend sein muss. Bei Apps und Webseiten für mobile Endgeräte haben Icons den Vorteil, dass man durch deren Verwendung Platz sparen kann. Wichtig ist für uns, dass man zwischen Scribble und Design trennt, um die jeweils richtigen Fragen, wie "Erkennt der Nutzer den Unterschied zwischen Musterhaus-Suche und Grundstück-Suche?" oder "Passen die Icons in die Corporate Identity des Kundes?" beantwortet zu bekommen. Für uns war die enge und konstruktive Zusammenarbeit mit dem Kunden sehr hilfreich, um zum einen an dessen Wissen über die Zielgruppe und zum anderen an den Funktionen hinter den Icons teilzuhaben.

Zum Abschluss noch ein Vorher-Nachher Vergleich des bauen.de Dashboards.

Nina

Vorher-Nachher-Vergleich

]]>
halil@insfx.com (Nina Wieland) Blog Mon, 09 Feb 2015 16:01:46 +0100
Bei Kaiserwetter gemeinsam Schnee, Sonne und Hüttenzauber genießen https://www.inserteffect.com/blog/bei-kaiserwetter-gemeinsam-schnee-sonne-und-huettenzauber-geniessen https://www.inserteffect.com/blog/bei-kaiserwetter-gemeinsam-schnee-sonne-und-huettenzauber-geniessen

Nachdem wir in den vergangenen zwei Jahren die alljährliche insertEFFECT Winterausfahrt ins Zillertal gemacht haben, stand dieses Jahr Obertauern als Ziel an.

Gruppenfoto

Gruppenfoto in unserem Hüttendorf in St. Michael. 

 

Bei wunderbarem Kaiserwetter haben wir zusammen ein tolles Winterwochenende verbracht. Obertauern ist ein 1A Wintersportgebiet, in dem man nicht nur Ski und Snowboard fahren kann, sondern auch Rodeln oder die Therme besuchen. Hier ein paar Impressionen von und abseits der Piste.

Abfahrt ersterTag

Die insfx-Snowboard-Gang.

GruppeRodeln

Ein Teil der Gruppe, die auch ohne Skier und Snowboard eine Menge Spaß hatte.

Abfahrt

Zwischenstopp auf der Obertauern-Route, die wir am Sonntag gefahren sind.

Chalets StMartin

Unser Hüttendorf - St. Martin Chalets.

Ausblick1 

Freitagabend Sonne. 

Huettenzauber

Mittagspause in der Sonne genießen.

PerfektePisten

Tolle Pistenverhältnisse!

Rodeln   Skilift

Ski und Rodel gut.

WinterWonderland

WinterWonderland2

 

Außerdem gab's wieder einen Après-Ski Hit ;-)

Nina

 

]]>
halil@insfx.com (Nina Wieland) Blog Fri, 23 Jan 2015 00:00:00 +0100
Wissensaustausch bei insertEFFECT https://www.inserteffect.com/blog/wissensaustausch-bei-inserteffect https://www.inserteffect.com/blog/wissensaustausch-bei-inserteffect

Auf einem Vortrag bei der MuC wurde eine Befragung unter UX/Usability-Professionals zitiert, wonach 87 Prozent der Befragten den "Austausch mit Kollegen" als wichtige Quelle zum Wissenserwerb angaben. Bei uns spielt der Wissensaustausch, auch interdisziplinär, ebenfalls eine sehr wichtige Rolle. Das Themenspektrum ist groß, für die nächsten Wochen stehen beispielsweise SEO oder Git-Advanced an.

Meist ist es so, dass jemand aus dem Team, der sich in den Tagen/Wochen zuvor mit einem Thema intensiver befasst hat, einen Wissensaustausch anbietet. Sandor ist zum Beispiel deutlich tiefer in der Welt der Suchmaschinenoptimierung als die meisten anderen aus dem Team. Deshalb bot er nun an, allen Interessierten einen Einblick in die SEO-Atmosphäre zu geben.
Gelegentlich kommt auch zu einer Thematik eine Ansammlung an Fragen auf. Dies ist in der letzten Zeit bei einem unserer Lieblingsthemen Git so gewesen. Über einen längeren Zeitraum haben wir in einem Spreadsheet Ungewissheiten im Umgang mit der Software zusammengetragen. Martin kümmert sich nun darum, diese in einer Session zu beantworten. Dadurch werden hoffentlich alle sicherer im Umgang mit Git und einer sauberen Versionierung steht nichts mehr im Weg.

Es gibt keine starren Regeln, wer welches Thema anbieten darf. Vielmehr ist der einzige Grundsatz: Wissen zu teilen.

Nachfolgend eine kleine Übersicht mit den Themen der letzten Zeit:

  • Android-Assets
  • Build-Prozess nativer Apps mit Jenkins
  • Datensicherheitsgrundlagen: Verschlüsselung
  • How to meeting
  • Photoshop CC 2014
  • Take-Aways von "beyond tellerrand", "border:none", "Mensch und Computer" u. a. Konferenzen
  • UI-Elemente iOS & Android
]]>
halil@insfx.com (Christoph Benker) Blog Tue, 16 Dec 2014 00:00:00 +0100
Impressionen von der dritten MobileFirst! Night https://www.inserteffect.com/blog/impressionen-von-der-dritten-mobilefirst-night https://www.inserteffect.com/blog/impressionen-von-der-dritten-mobilefirst-night

Am 16.10.2014 fand die dritte MobileFirst! Night statt. Mit 160 Teilnehmern ein neuer Rekord. Einen ausführlichen Bericht haben wir bereits unter dem Titel "Keep calm and don't believe the Hype" hier im Blog veröffentlicht. Hier einige Impressionen und Eindrücke der Teilnehmer.

Thema der diesjährigen MobileFirst! Night war Future Buzzwords. Nach der Vorstellungsrunde und einer kurzen Einführung von Benno sprach Heike Scholz unter anderem über vergangene Trends und Hypes. Ein Fazit:

Fragt sich, welche Technik-Trends, die heute aufkommen, haben dann das Potential, unser Leben von Morgen zu bestimmen?

Noch nicht ganz so klein wie ein Handy war das Tesla-Elektroauto, das vor dem Kinoeingang parkte. Es kam trotzdem gut an.

Individuum vs. Digividuum

Bei Jonny Götzes Vortrag waren auch die Zuschauer gefordert.

Teilnehmer bei Jonny Götzes Vortrag Mobile First! Night 2014

Foto: Markus Wolf auf www.nuernberg-und-so.de

Zum Beispiel, indem alle gemeinsam die Begriffe laut vorlasen. Hühnerleber, Entenleber, Gänseleber ... Hinster_bender.

Kopfkino ...

Kopfkino

Foto: greenlinephoto.com

.. die Zuschauer schliefen nicht, sondern hatten die Aufgabe, die Augen zu schließen und selbst einen Film zu drehen.

In den Pausen sorgte Bastus Trump für die passende Musik, stilecht auf dem iPad. 

15555533095 b0e57cc303 z

Foto: Sugar Ray Banister auf Flickr

Stummfilm-Atmosphäre

Leider lief nicht alles rund, die Teilnehmer nahmen es mit Humor.

 Weitere Impressionen

Future BuzzwordsInnenansicht Tesla insfxies auf der m1n Teilnehmer im Foyer

Foto: Sugar Ray Banister auf Flickr

 

Fazit: 

Die MobileFirst! Night fand im Rahmen der Nürnberg Web Week statt. Auch dort ziehen die Organisatoren ein überaus positives Feedback: 2.700 Teilnehmer waren auf den insgesamt 36 Veranstaltungen. Großes Kino! 

Mehr Bilder gibt es auf der MobileFirst!Night- Facebook-Seite oder bei Sugar Ray Banister.

Hier gibt es weitere Berichte: 

"Mit Buzzwords von 0 auf 100 in 3,4 Sekunden" von NÜRNBERG und so

"Nürnberg beschäftigt sich mit mobilen Trends" auf dem ERGO Direkt-Blog

"Keep calm and don't believe the Hype - MobileFirst! Night 2014 - Recap" - unser eigener Rückblick.

 

Vielen Dank an alle Teilnehmer, dass ihr da wart. Es hat viel Spaß gemacht!

 

 

Mit Buzzwords von 0 auf 100 in 3,4 Sekunden

Mehr dazu: http://www.nuernberg-und-so.de/blog/dritte-mobile-first-night-2014

]]>
halil@insfx.com (Ute Mündlein) Blog Fri, 31 Oct 2014 00:00:00 +0100