Alle Beiträge von Nina Schöning

Muse – ja oder nein?

Was genau ist eigentlich ein One Pager? Da ich mich sehr für das Thema Webdesign interessiere und im dritten Semester bereits einen One Pager programmieren musste, beantwortete sich diese Frage wie von selbst. Nun musste aber eine weitere wichtige Frage geklärt werden: Programmiere ich den One Pager für mein Projekt wieder selbst, oder überlasse ich den schwierigen Teil diesmal einem Programm?

Ich musste besonders früh feststellen, dass ich es in diesem Semester vor lauter Arbeit kaum schaffen würde, selbst zu programmieren. Meine Entscheidung fiel somit auf das Programm Adobe Muse, in welchem man die Elemente wie in den Grafikprogrammen Illustrator, Indesign oder Photoshop hin- und herschieben kann. Doch leichter gesagt, als getan: Das Platzieren der Elemente und das Einfügen von Bildern war kein Problem, jedoch war es unglaublich schwierig, das Layout meines One Pagers auf responsive – also an alle Geräte angepasst – einzustellen. Da mir die Zeit für lange Tutorials im Internet fehlte, musste ich an einigen Stellen schummeln. Nichts desto trotz erfüllt der One Pager nun seinen Zweck und ist zumindest auf iPad und iPhone 6, sowie allen gängigen Desktopauflösungen einigermaßen responsive.

bildschirmfoto-2017-02-04-um-22-03-42

In Zukunft möchte ich mich weiterhin mit Adobe Muse beschäftigen, auch wenn ich sehr große Probleme damit hatte. Mit ein bisschen mehr Übung und regelmäßiger Nutzung können damit sicher ein paar tolle Webprojekte entstehen und durch die Updates wird es höchst wahrscheinlich im Laufe der Zeit noch benutzerfreundlicher.

Auf meinem Weg durch die Welt der One Pager sind mir übrigens ein paar tolle Layouts aufgefallen, die ich euch natürlich nicht entgehen lassen möchte. Viel Spaß beim Anschauen und: Haltet eure Retina-Displays fest! 😉

http://www.bevisionare.com/

https://mailchimp.com/2016/

https://www.jsconfar.com/

http://brightmedia.pl/?lang=en&site=intro


Der Artikel Muse – ja oder nein? hat die Lizenz CC-BY-NC-4.0 CLIC, bzw. des jeweiligen Autors.

Illustriertes Storytelling

Unsere Semesterprojekte müssen Anfang Februar in Form eines One Pagers präsentiert werden. Die Websites dienen zur Promotion unserer Ideen und sollen die Projekte in möglichst wenigen Worten erklären.

Ich habe mir tatsächlich das ganze Semester lang darüber den Kopf zerbrochen, wie ich das anstellen könnte. Da ich ein Mensch bin, der viele Worte benötigt um etwas zu erklären, gestaltete sich diese Aufgabe besonders schwierig. Während ich die letzten Wochen darüber nachdachte, fiel mir beim Nutzen meines Smartphones auf, dass ich (wie viele von uns) sehr oft Emoticons, also kleine Bilder bzw. Symbole nutze, um meine Gedanken zu erklären und meine Worte zu unterstreichen.

Auswahl an Emoticons auf dem iPhone

Auswahl an Emoticons auf dem Smartphone

Und zack, da war sie: die Idee, das Projekt in Form von Illustrationen zu erklären. Ich überlegte erst, dazu ein kleines Video in Adobe After Effects zusammenzuschneiden, allerdings konnte ich mir nicht vorstellen, dies zeitlich noch auf die Reihe zu kriegen. Aber eines war klar: die Idee mit den Illus steht.

Ergänzend dazu überlegte ich mir ein kleines Szenario mit meiner Persona, um das Projekt mithilfe von Storytelling Schritt für Schritt zu beschreiben. Die Illustrationen sollen nach und nach einzeln mit einem jeweiligen kleinen Textabschnitt gezeigt werden, um so mehr Spannung in das Storytelling zu bringen. Außerdem eignet sich ein One Pager dafür besonders gut und so machte ich mich schließlich an die Arbeit …

1_dasistpascalneu-01

 2_liebtvideospiele-01

3_undveranstaltet-01

weitere Bilder folgen 😛 <img src=" class="wp-smiley" style="height: 1em; max-height: 1em;" /> <img src=" class="wp-smiley" style="height: 1em; max-height: 1em;" />


Der Artikel Illustriertes Storytelling hat die Lizenz CC-BY-NC-4.0 CLIC, bzw. des jeweiligen Autors.

Ein „verplanktes“ Projekt

„Für jedes Problem gibt es eine Lösung.“

Unter diesem Motto haben Designer und andere Kreative im Laufe der Zeit unendlich viele Methoden entwickelt, um die Probleme einer Idee oder eines Projekts zu lösen. In unserem CLIC-Seminar haben wir eine dieser Methoden genau angeschaut und diese auf unsere Projekte angewendet oder um genau zu sein: Wir haben unsere Projekte „verplankt“ – nach einem Modell aus dem „Interaction Design Sketchbook“ von Bill Verplank. In diesem Blogpost werde ich genanntes Modell anhand meines verplankten Projekts zeigen und erläutern.

Das Modell setzt sich aus insgesamt acht Schritten eines Frameworks zusammen, die keine festen Vorgaben darstellen, aber die Hauptanliegen des Projekts ansprechen sollen:

Modell: Framework für Interaction Design von Bill Verplank.

Modell: Framework für Interaction Design von Bill Verplank.

Schauen wir uns nun einmal mein Projekt unter diesen Schritten an:

modell-verplank

Die IDEA beschreibt den Grundgedanken hinter meinem Projekt. Bei METAPHOR musste das Prinzip der Idee in einen bildhaften Ausdruck umgewandelt werden, also „Welches bereits vorhandene Prinzip nutzt mein Projekt?“. Zu meiner Idee lässt sich zusätzlich ergänzen, dass sie auch auf dem Konzept des Karussells basiert, da die gezeigten Veranstaltungen immer wieder wechseln und in einer Endlosschleife präsentiert werden.

IDEA: Teilen von privaten Veranstaltungen und Aktionen durch eine App und mehrere Urban Screens.

 

METAPHOR: Plakatanzeigen und Leuchtreklame.

Als nächstes ging es um das MODEL – welche Interaktion findet auf welche Weise statt? Unter DISPLAY habe ich anschließend die geplante Umsetzung und Darstellung der Idee erläutert.

MODELL: Interaktion durch App / durch Sensor an den Screens.

 

DISPLAY: Newsfeed der Veranstaltungen wird auf großen Screens an belebten Orten in der Stadt gezeigt.

Nun ging es weiter mit ERROR: Welche Probleme möchte ich lösen? Im sechsten Punkt SZENARIO wurde die Situationen beschrieben, die meinen Zielgruppen den Anlass geben, mein Produkt zukünftig zu nutzen.

ERROR: 1. Ich veranstalte ein Event, aber niemand kommt. 2. Ich möchte etwas unternehmen, weiß aber nicht wo in der Stadt etwas los ist.

 

SZENARIO: 1. Ich möchte viele Leute über meinen Flohmarkt informieren. 2. Ich bin gerade unterwegs und möchte wissen, was in der Stadt los ist, bzw. neue Leute kennenlernen.

Die letzten beiden Punkte – TASK und CONTROL – beschreiben die Aufgaben der Screens und wie genau ich mit diesen interagieren, bzw. wie ich sie steuern kann.

TASK: Aufstellen der Screens in der Stadt (Installation), zeigen Bilder / Videos von Veranstaltungen, Wechseln der Bilder / Videos, Sensor registriert Bewegungen, Informationen werden bei Nähe eingeblendet, Navigation durch Handbewegungen.

 

CONTROL: Kontrolle und Navigation durch Handbewegungen (Sensor) / durch App.

Das Modell lässt sich auf neue und bereits existierende Projekte anwenden und man kann auf diese Weise schauen, ob die eigenen Überlegungen funktionieren.


Der Artikel Ein „verplanktes“ Projekt hat die Lizenz CC-BY-NC-4.0 CLIC, bzw. des jeweiligen Autors.

Leap Motion – Ein guter Grund für eingeschlafene Hände

Vor einiger Zeit durfte ich ein Produkt testen, welches mich in eine völlig neue Welt eintauschen ließ und mir außerdem mit meinem Semesterprojekt ein ganzes Stück weiterhelfen konnte.

Es handelt sich dabei um einen kleinen Sensor bzw. Controller von der Firma Leap Motion, der sich nach dem Auspacken in kürzester Zeit verwenden lässt. Per USB-Kabel an den Laptop anschließen, Programm auf der Website von Leap herunterladen und los geht’s: Es öffnet sich ein Fenster und das Tutorial beginnt. Aber was macht dieser Sensor denn nun?

Leap Motion Controller

Leap Motion Controller

Wichtig ist, dass man ihn vor sich auf den Tisch legt, sodass man seine Hände darüber bewegen kann. Gesagt, getan und schon bemerkt man eine Bewegung auf dem Bildschirm. Man ist zunächst überrascht und kann seinen Augen nicht trauen, denn die eigenen Hände die man über den Sensor hält werden nun auf dem Bildschirm dargestellt und jede Bewegung wird synchronisiert. Ja, sogar die jedes einzelnen Fingers!

Nach kurzem Eingewöhnen kann es weitergehen – nun soll man kleine Roboter zusammenbauen und Blütenblätter pflücken. Kein Problem, denn der Leap-Sensor erkennt sogar Greifbewegungen. Nach dem Tutorial kann man sich im Leap-Appstore anmelden und weitere Anwendungen herunterladen, viele davon sind kostenlos. Ich lud mir eine App herunter, mit welcher man mit den Händen leuchtende Punkte durch eine Unterwasserwelt bewegen und damit Fische anlocken konnte. So kam ich übrigens auf eine meiner Konzeptideen, die in diesem Beitrag vorgestellt wird. Es gibt also unzählige Möglichkeiten sein virtuelles Erlebnis mit Leap Motion zu gestalten.

Ich war davon jedenfalls total begeistert, denn wann hat man schon mal die Möglichkeit die virtuelle Welt mit den Händen zu steuern? In meinem Semesterprojekt „on my way“ wird so ein Sensor auf jeden Fall auch zum Einsatz kommen 🙂


Der Artikel Leap Motion – Ein guter Grund für eingeschlafene Hände hat die Lizenz CC-BY-NC-4.0 CLIC, bzw. des jeweiligen Autors.

Konzept „on my way“

Nach langem Überlegen ist es nun doch das Konzept zu den Events in der Stadt geworden, allerdings mit einigen Änderungen. In diesem Beitrag möchte ich mein überarbeitetes Konzept wiedergeben und darstellen:

on-my-way-grafik1-01-01

Durch die Nutzung einer App und das Aufstellen mehrerer Urban Screens in der Stadt, soll es den Menschen möglich gemacht werden, ihre persönlichen Veranstaltungen zu veröffentlichen oder unterwegs die von anderen zu entdecken.

Möchte ich zum Beispiel noch heute einen Flohmarkt oder eine Vernissage bei mir zuhause veranstalten, öffne ich die App, erstelle in wenigen Schritten eine Anzeige mit einem individuellen Bild oder Video und sende sie an die Screens in meiner Umgebung.

Zuvor erhalte ich eine Vorschau, in der ich sehen kann, wie meine Anzeige auf den Screens aussehen wird. Auf diesen 2 Meter hohen Urban Screens erscheint nach dem Senden mein Bild oder Video, welches die Aufmerksamkeit der Leute auf sich zieht und einen Tag lang für 30 Sekunden in einem sich wiederholenden Wechsel mit anderen geposteten Veranstaltungen in einem Feed angezeigt wird.

Auf dem Boden vor den Screens ist eine Markierung  und die Frage „Hast du heute schon etwas vor?“ zu sehen. Sobald jemand interessiert ist und näher an den Screen herantritt, erscheint die Information, dass man seine Hand bewegen soll, um den Screen zu navigieren. Ein Sensor erfasst Handbewegungen und man kann so durch das Hoch- und Runterbewegen seiner Hand durch die aktuellen Veranstaltungen in der Nähe scrollen.

Bleibt man bei einer Veranstaltung stehen, werden Titel, Name des Veranstalters sowie Informationen und Standort dazu eingeblendet.

Am unteren Rand jedes Screens befindet sich eine feststehende Fläche, auf der eine Beschreibung der Aktion und Aufforderung zum Mitmachen stehen. Darunter ist ein QR-Code mit Link zur App zu finden.

Mein Projekt soll dazu dienen, dass die Nutzer neue Leute mit den gleichen Interessen kennenlernen und sich gegenseitig unterstützen können. Des Weiteren sollen soziale Projekte, wie z.B. Spenden- oder Hilfsaktionen, mehr Aufmerksamkeit bekommen. 

Ich hoffe sehr, dass mir zu diesem Projekt noch mehr einfällt, damit ich es weiter ausbauen kann 🙂


Der Artikel Konzept „on my way“ hat die Lizenz CC-BY-NC-4.0 CLIC, bzw. des jeweiligen Autors.

Happy Sketching

Da es mir gerade sehr sehr schwer fällt, mein Thema genau zu definieren, dachte ich es wäre an der Zeit, ein wenig zu skizzieren und durch das Zeichnen neue Ideen entstehen zu lassen. Also Stifte raus und los!

15127360_1180156658705689_1804675077_o

Zuerst habe ich versucht meine Idee mit dem Verschicken von persönlichen Nachrichten mithilfe einer App, die diese an mehrere Urban Screens versendet, weiterzuentwickeln. Mir fiel dazu ein, dass man dieses Konzept auch dazu nutzen könnte, sich gegenseitig über Events in der Stadt zu informieren.

Sprich, ich gehe z.B. mit Freunden zu einer Party in einem Club und mache ein Foto. Dieses Foto sende ich nun an die Urban Screens in der Umgebung, die Leute werden das Foto dort entdecken und bekommen aus der Ferne zu sehen, was auf der entsprechenden Veranstaltung los ist und ob es sich vielleicht lohnt, auch dorthin zu gehen.

So viele Möglichkeiten …

15127326_1180156865372335_834423243_o

Die zweite Idee beschäftigt sich eher mit Urban Gaming und ist ohne Berücksichtigung der vorherigen Idee, mit alleinigem Bezug auf Urban Screens, entstanden: Man könnte mehrere Screens an verschiedenen gut besuchten Plätzen in der Stadt aufstellen. Die Screens besitzen einen Sensor, der die Bewegungen der vorbeilaufenden Menschen in kreisförmige Lichter umwandelt. Vor den Screens befindet sich jeweils eine Markierung. Tritt man dichter an den Screen heran, so wird das Licht heller und sobald man die Markierung erreicht hat, erscheint die Aufforderung, dass man sein Smartphone einschalten und mit dem Licht des Bildschirms in den Sensor halten soll.

Das Smartphone funktioniert nun wie eine Art Controller, der den hellsten Punkt auf dem Screen steuert. Nun ploppen mehrere Lichter auf und man muss diese nach einer bestimmten Zeit „einfangen“. Je mehr Leute sich mit dem Smartphone vor den Screen stellen und gemeinsam die Lichter sammeln, desto höher kann die zu erreichende Punktzahl ausfallen.

15133642_1180156468705708_1581599188_o

Im Moment tendiere ich zur zweiten Idee, da ich mich vor Kurzem mit Leap Motion, einem VR-Programm beschäftigt habe, aber dazu im nächsten Beitrag mehr… 😉


Der Artikel Happy Sketching hat die Lizenz CC-BY-NC-4.0 CLIC, bzw. des jeweiligen Autors.

Urban Screens – oder das Spiel mit riesigen Bildwelten

Mein heutiger Blogeintrag soll kurz den holprigen Weg zur Auswahl meines Semesterprojekts Urban Screens beschreiben. Bei Urban Screens handelt sich um riesige Bildschirme oder auch Bildprojektionen auf Gebäude, welche in Städten zu finden sind und so manch lustige Aktion mit sich bringen:

Aber nun zum Anfang.

Unsere Aufgabe war es, ein geeignetes Semesterprojekt zum Thema Interaction Design zu finden. Ich sammelte zunächst Dinge, die mich interessieren oder mir spontan in den Sinn kamen. Um mir einen Überblick über mein Gedankenwirrwarr zu verschaffen, erstelle ich zu jedem Kreativ-Projekt immer mindestens eine Mind Map. Die Mind Maps helfen mir dabei, den Weg meiner Gedanken zurückzuverfolgen und diesen nachzuvollziehen. Machmal ergeben sich auf diese Weise nochmal ganz neue Richtungen, die man einschlagen und erweitern kann.

bildschirmfoto-2016-11-13-um-22-58-47

Meine erste Mind Map legte ich mithilfe des Programms SimpleMind zum Thema Urban Interaction an. Der erster Gedanke war, dass ich gerne etwas zur geregelten Müllentsorgung beitragen würde, da mich die verschmutzen Straßen in Städten, aber auch auf dem Lande extrem stören. Allerdings fehlte mir dazu die zündende Idee, ich dachte mir lediglich, dass man das Problem eventuell spielerisch lösen könnte, da Menschen immer ein Belohnungssystem brauchen, um motiviert zu sein.

Eine weitere Idee fiel mir durch Apples Claim „Think different“ ein: Das Platzieren von ungewöhnlichen, aber funktionellen Dingen in der städtischen Umgebung, damit sich die Menschen genauer mit den alltäglichen Gegenständen um sie herum beschäftigen und ihre Funktionen nicht als selbstverständlich nehmen.

Auf das Thema Urban Screens stieß ich durch die dritte Idee, persönliche Botschaften auf digitalen Plakatwänden zu zeigen, die wir während der Lehrveranstaltung nochmal besprachen und erweiterten. Die Grundidee zu den digitalen Plakaten ist mit den Urban Screens bereits vorhanden. Nun gilt es, die Funktionen der Screens genau zu analysieren und meine Idee mit den persönlichen Botschaften oder vielleicht auch einen ganz neuen Gedanken darauf anzuwenden und weiterzuentwickeln. Ich bin sehr gespannt auf das, was mit diesem Projekt auf mich zukommt und natürlich musste auch hierzu direkt eine Mind Map erstellt werden 😉

bildschirmfoto-2016-11-13-um-23-23-10

 

Auf den Spuren des Corporate Designs

„Was ist eigentlich dieses Corporate Design?“

Wenn man Kommunikationsdesign studiert und am Anfang diese Frage stellt, bekommt man oft die Antwort „Verwechselt das bloß nicht mit der Corporate Identity!“

Und was war das nun wieder?

Die Antwort ist eigentlich recht simpel: Die Corporate Identity ist die Art und Weise, wie sich ein Unternehmen in der Öffentlichkeit gibt, wie die Firmenphilosophie und das Leistungsangebot kommuniziert werden. Man könnte die Corporate Identity also sozusagen als „Charakter eines Unternehmens“ beschreiben. Irgendetwas fehlt da aber noch, oder? Dieser Charakter braucht auch noch einen Körper, mit einem bestimmten Aussehen und einer Art zu Handeln, die andere von seiner Philosophie überzeugt. Und genau das macht das Corporate Design.

Schon im Mittelalter gab es viele verschiedene Wappen, die eine Familie oder sogar ein ganzes Königreich repräsentiert haben. Die Ritter und Kämpfer trugen das Wappen mit Stolz auf ihren Rüstungen, um Zugehörigkeit, Regeln, Moral und Werte ihres Königreiches im Krieg oder bei Verhandlungen zu kommunizieren.

Beispiel für ein Corporate Design im Printbereich

Beispiel für ein Corporate Design im Printbereich

Heute ist das Corporate Design in jeder Werbeagentur ein Begriff, da sich das Konzept des Wappens auf unsere Markengesellschaft übertragen hat. Kauft man heute ein Produkt, so kauft man auch den Stellenwert der Marke in der Gesellschaft, sowie auch deren Belohnungsmotiv.

Die Unternehmen lassen sich für ein hohes Sümmchen ein ganz eigenes individuelles Firmendesign erstellen. Dazu finden Interviews, Briefings und ab und zu auch Firmenrundgänge statt, damit die Designer die Corporate Identity und das Verkaufsversprechen des Unternehmens genau analysieren und auf das Corporate Design übertragen können. Es werden verschiedene Eigenschaften herausgearbeitet und mit Design-Merkmalen umgesetzt, bis ein einheitliches Erscheinungsbild entsteht, welches in allen medialen Bereichen eingesetzt werden kann. Schauen wir uns das Beispiel nochmal genauer an:

cd-grafik2

Natürlich präsentiert das Beispiel nur ein Corporate Design, die Corporate Identity fehlt jedoch. So ist es uns unmöglich dieses Design einem Unternehmen zuzuordnen. CI und CD gehören somit immer zusammen und werden alleine keinen Erfolg haben.

Spazieren ohne aufzustehen

Für die alltäglichen Entdeckungen müssen wir oftmals nicht mal mehr einen Schritt vor die Tür setzen, denn die Technik – vor allem das Internet – bietet uns, unseren Bedürfnissen und unseren Sinnen immer mehr.

screen-shot-2014-04-04-at-18-29-19

Wenn man von Deutschland aus, am helllichten Tage, mit Socken und Tee im Bett einen Spaziergang durch das nächtliche Marseille machen kann, dann kann man sich sicher sein, dass die digitale Welt bald keine Grenzen mehr kennen wird.

Der Google Night Walk macht es möglich – wir können unseren imaginären Rucksack packen und mit netten Leuten auf eine kleine Reise gehen. Es gilt Streetart, Jazz-Konzerte und die französische Küche zu entdecken, ohne dabei gut zu Fuß zu sein. Schließlich bietet uns Google eine virtuelle Möglichkeit, bei der nur unser Seh- und Hörvermögen beansprucht wird. Man lehnt sich zurück, lässt das Street-View-Erlebnis auf sich wirken und hat nicht mal einen Cent dafür ausgegeben.

In dieser Zeit der VR-Brillen und regelmäßigen Ausflügen in digitale Welten weiß man nicht genau, was man denken soll. Einerseits macht es neugierig und man probiert diese Dinge gerne aus, andererseits ist dort die Angst, dass es die Welt und die Menschen stark verändern könnte.

Wird es sich in ein paar Jahren noch für uns lohnen rauszugehen? Die Luft einzuatmen, weite Wege zu gehen und Fotos zu schießen? Sich bei Freunden darüber beschweren, dass man sich wieder einen Sonnenbrand geholt hat? Oder wird die virtuelle Realität zur neuen Komfortzone?

Ich bin gespannt.