Responsive Designs noch einfacher umsetzen

Max Koehler

Die Möglichkeit, fast alle Moduleinstellungen individuell für verschiedene Breakpoints anzupassen ist eines unserer wichtigsten Features. Die Änderungen an der Oberfläche, die wir in diesem Sprint umgesetzt haben werden es wesentlich einfacher machen, Designs auf verschiedenen Auflösungen zu testen und Einstellungen an den entsprechenden Breakpoints anzupassen. Wir haben schon eine Weile an diesem Feature gearbeitet.

Mehr Breakpoints!

Der Grund, warum wir bisher nicht mehr als drei Breakpoints angeboten haben ist einfach. Wir wollen Benutzer ermutigen, für allgemeine Gerätekategorien wie „Mobiltelefon“ oder „Tablet“ zu gestalten, anstatt für eine Vielzahl spezifischer Modelle wie „iPhone 6s“.

Wir sind immer noch überzeugt, dass das der richtige Ansatz ist, haben aber in unserer eigenen Erfahrung und aus Feedback von Benutzern gelernt, das insbesondere komplexere Layouts mitunter etwas feinere Kontrolle benötigen. Deshalb führen wir drei weitere, frei definierbare Breakpoints ein.

Sie sind standardmässig deaktiviert, ihr könnt sie aber einfach in den Breakpoint-Einstellungen einschalten und zusätzlich die Breite in Pixeln zu jedem Wert setzen, den ihr benötigt.

Breakpoint Konfiguration

Auftritt: Das Breakpoint-Lineal

Eine größere Zahl von Breakpoints macht es schwieriger die Übersicht in der rechten Toolbar zu behalten. Also haben wir nach einem Weg gesucht, die Breakpoints in der Anwendung besser und einfacher zu visualisieren. Das Ergebnis ist das neue Breakpoint-Lineal

Schau dir das folgende Video an, um es live in Aktion zu sehen.

Jeder Breakpoint erscheint als farbiger Abschnitt im Lineal über dem Vorschaufenster. Ein Linksklick auf den Abschnitt setzt das Vorschaufenster auf die entsprechende Auflösung. Ein Klick in den grauen Bereich am rechten Rand des Lineals bringt die Vorschau zurück auf die Standardauflösung.

Was denkst du?

Wie viele der sechs Breakpoints wirst du in deinen Projekten benutzen, oder wünschst du dir sogar noch mehr Breakpoints? Schreib uns bei Twitter @rukzuk, bei facebook oder via E-Mail unter help@rukzuk.com.

Du findest nicht das was du suchst? Kein Problem, schau vorbei in unserem Helpdesk.

Built with pride in rukzuk © 2015 rukzuk AG