Designkonzeption für App und Web.

Überzeugen Sie bereits auf den ersten Blick!

Sie suchen noch nach dem richtigen Design für Ihre Webseite, App oder Webapplikation? Wir bieten Ihnen gemeinsam mit unseren Designern die Entwicklung Ihrer Designentwürfen an und können Sie dabei gleichzeitig technisch sehr gut beraten.

Entwerfen Sie jetzt mit uns Ihr passendes Design!

Settings#3
Konzeption

Wir besprechen mit Ihnen und unseren Design-Experten Ihre Vorstellungen, um gemeinsam jene Oberfläche gestalten zu können, die Sie und Ihre Endnutzer sich wünschen und von welcher Begeisterung erwartet werden kann.

Mehr über Workshops

Display#1
Responsiveness

Vor allem bei Webseiten und Webplattformen muss man heutzutage mehrere Layouts entwerfen, um auf jedem Endgerät eine gute User-Experience zu schaffen. Daher wird auch für verschiedenste Größen und verschiedenste Geräte wie Smartphones, Tablets, Desktop & Co das Layout angepasst.

Mehr über Webentwicklung

Laptop-macbook
Designentwurf

Wir überlassen unseren erfahrenen Designerinnen und Designern die schwierige Aufgabe, das perfekte Layout, die am besten harmonisierenden Farben und die richtigen Grafiken auszuwählen, um einen rundum guten Eindruck zu erzielen. 

Mehr über die Designer

Clipboard-check
Usability-Testing

Um noch vor der Entwicklung herausfinden zu können, ob das Design eine gute User-Experience ermöglicht, wenden wir bereits auf den digitalen Mockups unserer Designer Usability-Tests an. Hier gibt es eine Vielzahl an Möglichkeiten, um das adäquate Ausmaß zu finden. 

Mehr über Usability-Testing

UI- und UX-Design

Die Design-Konzeption ist für reine Softwareentwickler oft eine sehr schwierige Sache, vor allem wenn es um ein kreatives User Interface (UI) und eine perfekte User Experience (UX) geht. Man kann zwar ein vorgegebenes Design meist sehr einfach und schnell umsetzen, wenn es aber zum Designen kommt, wird es oft sehr ineffizient und unkreativ. Daher arbeiten wir eng mit Designerinnen und Designern zusammen, die bereits viel Erfahrung im Bereich User Experience, Layouting, Farbwahl, Schriftarten und der Zusammenarbeit mit Endkunden vorweisen können.

Unsere Design-Roadmap

Wir beginnen mit einem Requirements Engineering Workshop, entwerfen erste Mockups, übergeben diese den Designern, welche schlussendlich verschiedenste Varianten mit dem Kunden besprechen und anschließend das finale Design umsetzen.
Oft folgt darauf ein Usability-Test mit eigenem digitalen Click-Dummy, bis anschließend das Design im Frontend umgesetzt und ausgeliefert wird.

Requirements Engineering, Paper- & Pencil Mockups und Design-Vorschläge

Der typische Weg, den wir beschreiten, ist meist jener, dass wir mit unserem Kunden dessen Vorstellungen besprechen und in einem Requirements Engineering Workshop im Detail herausfinden, was entwickelt werden soll. Gibt es noch kein Design und soll dieses ebenfalls mitentwickelt werden, so besprechen wir dies mit unseren Designern. Diese bekommen dann von uns die aus den erfassten Requirements erstellten Mockups.

Auswahl, Umsetzung, Click-Dummy und Usability Testing

Sobald die Designer eine Auswahl an Design-Vorschlägen präsentieren können, melden sie sich bei uns oder direkt bei Ihnen, um die verschiedenen Lösungsansätze durchbesprechen zu können. Sobald eine Entscheidung getroffen wurde, geht es dann ans Eingemachte und die Designer entwerfen das finale Design.

Und genau hier kommt dann auch der früh angesetzte Usability Test ins Spiel. Typischerweise bieten wir Thinking Aloud Tests an, wo ein Benutzer sich durch die digitalen Mockups, welche zu einem sogenannten „Click-Dummy“ zusammengeführt wurden, durcharbeiten kann und dabei laut ausspricht, was er/sie denkt, fühlt und tut. So schafft man es, bereits früh Probleme in der User Experience aufwerfen zu können und Design-Entscheidungen umändern zu können. Mittels A/B-Testing könnte man außerdem zwei Alternativen vergleichen, um die bessere Variante finden zu können (hier zeigt man einer Gruppe Variante A und einer Gruppe Variante B und stellt ihnen gleiche Aufgaben, um schließlich herausfinden zu können, welche Wahl die effizientere, bessere und/oder besser benutzbare ist).

Natürlich ist das Usability Testing für manche Anwendungsfälle ein Overhead, weswegen solche Entscheidung in unseren Workshops angesprochen und gefällt werden.

Media Queries und Breakpoints für Responsiveness

Ein ganz besonders wichtiger Punkt ist für uns das Auslegen der Designs auf verschiedenste Device-Größen. Dies ist vor allem bei Webseiten und Web-Applikationen beziehungsweise Web-Plattformen wichtig, welche auf jeglichen Endgeräten angezeigt werden sollen. Hier bedienen wir uns in der Entwicklung den Media Queries, welche in CSS3 eingeführt wurden. Damit kann man sogenannte „Breakpoints“ definieren, ab welcher Größe, i.A. die Breite des Screens, welche Designattribute zur Verwendung kommen sollen. Somit können wir zwischen verschiedenen Screens differenzieren.

Unsere von Designern vorgeschlagenen und zumeist umgesetzten Breakpoints sind die folgenden:

  • Mobile: weniger als 600px
  • Tablet (Portrait): zwischen 600px und 839px
  • Tablet (Landscape): zwischen 840 und 1299px
  • Desktop: zwischen 1300px und 1919px
  • Large Desktops: 1920px

Bei mehr als 1920px Breite wird üblicherweise außerhalb der Applikation/Webseite ein Rand angezeigt, der zum Beispiel grau eingefärbt ist. Auf diese verschiedenen Größen optimieren also unsere Designer zumeist hin, wobei man natürlich auch Abstriche machen und Zusatz-Breakpoints einführen (je nach Bedarf) kann.

Wir konnten Ihr Interesse wecken?
Dann kreieren Sie jetzt mit uns Ihr neues Design!

Arrow-up