Kuratierte Linksammlung für Webdesigner und -entwickler.

rukzuk – Das visuelle Responsive Webdesign Tool

Folgendes Szenario: Du erhältst grünes Licht von Deinem Kunden für die Umsetzung einer neuen Website. Wie gehst Du vor? Vermutlich erstellst Du zuerst das Design mit einer Software wie Adobe Photoshop oder InDesign. Anschließend setzt Du das Design als Template oder Theme in HTML/CSS und JavaScript um und integrierst es, nachdem Du ein Webhosting-Paket abgeschlossen hast, in ein Content Management System wie WordPress.

Weil die Umsetzung dieser verschiedenen Arbeitsprozesse häufig nicht den abgenommenen Entwürfen entspricht (unterschiedliches Schriftrendering, Darstellung in unterschiedlichen Browsern und Endgeräten usw.), können sie Dich in Deinem Workflow behindern. Kleinste Änderungen bremsen Arbeitsschritte und verzögern die Fertigstellung der Kundenwebsite.

Anzeige

Mit rukzuk werden diese Schritte zusammengefasst. rukzuk gelingt die Verschmelzung von Design- und Codingsoftware, Content-Management-System und Webhosting. rukzuk ist eine All-In-One Lösung zum Gestalten und Verwalten von Websites, die es Webdesignern auf einfache Weise ermöglicht, kundenorientierte Websites zeitsparend zu erstellen, ohne auf Programmierkenntnisse zurückgreifen zu müssen.

rukzuk ist browserbasiert, Du gestaltest also direkt in Deinem Browser. Du siehst zu jeder Zeit, wie sich Deine Arbeitsschritte auf die bis dahin fertige Version der Website auswirken, ganz nach dem Motto „What You See Is What It Really Is“.

Lass uns doch mal schauen, wie rukzuk funktioniert.

Wie funktioniert rukzuk?

Der kleinste Baustein in rukzuk ist das Modul, wobei jedes Modul eine bestimmte Funktion hat (Galerie, Navigation, Formular usw.).

Modulübersicht in rukzuk.

Diese Module können in einer hierarchischen Struktur zu einem Layout zusammengestellt werden. Zum Gestalten gibt es eine Vielzahl von Eigenschaften wie Schriftformatierung, Hintergründe und CSS3-Effekte. Ein Layout ist wiederum die Vorlage für die Seiten einer Website. Du kannst einfach eine neue Seite anlegen, das Layout wählen und anschließend mit Inhalten befüllen. Dabei kannst Du genau festlegen, welche Module eines Layouts auf einer Seite verändert werden dürfen. In Kombination mit den Benutzergruppen können damit andere Personen, wie zum Beispiel Deine Kunden, die Inhalte selbstständig pflegen.

Die fertige Website – bestehend aus beliebig vielen Seiten, die wiederum mit beliebig vielen Layouts erstellt werden können – kann direkt aus rukzuk oder manuell auf einen Live-Server bei einem beliebigen Webhosting-Anbieter übertragen werden.

Überblick

Anders als Bearbeitungsprogramme wie Adobe Photoshop, die üblicherweise auf dem eigenen Computer installiert sind, funktioniert rukzuk im Browser. Das hat den Vorteil, dass rukzuk auf jedem Computer mit modernem Browser funktioniert.

Space Login

Nachdem Du zuerst Deinen bevorzugten Browser geöffnet hast, kannst Du Dich in Dein rukzuk-Bereich einloggen.

Login-Bereich

Nach Anmeldung gelangst Du in Deine Übersicht, wo Du alle bereits angelegten Webprojekte einsehen und neue Projekte anlegen kannst.

Projektübersicht

Durch eine Auswahl von Vorlagen kannst Du ein neues Projekt anlegen oder auch von Grund auf neu anlegen.

Projekte bearbeiten

Durch Doppelklick auf das Vorschaubild in der Projektübersicht öffnest Du das ausgewählte Projekt.

Projekte bearbeiten

Innerhalb eines Projektes hält das Menü eine Menge vielfältige Funktionen bereit, wie zum Beispiel das Farbschema.

Seiten

Über den linken Bereich der Bearbeitungsseite sind die angelegten Seiten in einer Menüstruktur aufgeführt. Hierrüber kannst Du weitere Seiten hinzufügen und sie über die Seitenstruktur sortieren.

Seitenstruktur

Für jede Seite kannst Du außerdem eigene Layouts zuweisen. Das Ergebnis Deiner Änderungen erscheint zeitgleich in der zentrierten Seitenvorschau.

Auf der rechten Seite wird Dir ein vertikales Menü bereitgestellt, worüber Du das Vorschaufenster im Responsive Design sehen und bearbeiten kannst.

Responsive Design Wechsel-Navigation

Natürlich kannst Du das Vorschaufenster auch direkt mit der Maus groß- und klein ziehen, um den Responsive Design-Effekt unmittelbar zu sehen. Über den unteren Lupe-Button gelangst Du zur Live-Vorschau Deines rukzuk-Projektes und siehst Deine Seite in Deinem Browser.

Layout bearbeiten

Über den linken Bereich der Projektbearbeitungsseite kannst Du das Layout öffnen und den Bearbeitungsmodus aufrufen. Innerhalb der Layout-Struktur siehst Du nun die Baumansicht der Module, die für Deine Website angewendet werden. Sobald Du mit der Maus über eines dieser Layout-Module herüber navigierst, wird dies im Vorschaufenster zeitgleich hervorgehoben, sodass Du immer sofort sehen kannst, wo ein ausgewähltes Modul innerhalb Deiner Website verwendet wird.

Layout bearbeiten

Wie bei der Seitenstruktur, kannst Du auch hier die gewünschten Module sortieren, bearbeiten und neue Module via Drag & Drop an die gewünschte Stelle innerhalb der Layout-Struktur hinzufügen.

Module bearbeiten

Um Elemente auf der Seite zu bearbeiten, kannst Du direkt über die Live-Ansicht in den gewünschten Bereich klicken oder das zu bearbeitende Modul über die Layout-Struktur auswählen und es über den Reiter für Eigenschaften bearbeiten, wobei jedes Layout-Modul eigene Eigenschaften hat.

Module bearbeiten

Für wen ist rukzuk geeignet?

  • rukzuk eignet sich für alle, die Websites privat oder professionell erstellen und verwalten möchten und keine Zeit oder Kosten in die Programmierung der Website investieren möchten.
  • Freelancer und Agenturen, die zeitnah Websites für Präsentationen entwerfen müssen, können diese, anders als mit Mockup-Tools, sofort live schalten.
  • rukzuk ist ideal für die Erstellung von Landing Pages, Microsites, Verkaufsseiten oder Event-Websites geeignet. Für individuelle Wünsche ist rukzuk ständig erweiterbar. Programmierbegeisterte Designer und Entwickler können mittels umfangreicher PHP- und JavaScript-API eigene Module und Styles erstellen.

Fazit

rukzuk ist mehr als nur ein Webbaukasten. Es lässt den Designer gestalterische Freiheit, um pixelgenaue responsive Websites zu erstellen. Und das ohne über Programmierkenntnisse verfügen zu müssen. Die nahtlose Einbindung eines vollwertigen CMS ist in dieser Form einzigartig; die Website kann außerdem kostenlos über rukzuk gehostet werden. Für Endverbraucher, die sich rasch eine Webseite basteln möchten, ist rukzuk dagegen wahrscheinlich etwas zu komplex.

Link zum Beitrag:
https://rukzuk.com/de/

Frischer Input für Designer. Jeder Abonnent erhält das kostenlose Bundle aus 50 Photoshop Device-Mockups und 40 Responsive WordPress-Themes.

1x pro Woche. Kein Spam. Jederzeit kündbar.
Jonathan Torke
Jonathan Torke

Auf pixeltuner.de teile ich aktuelle Ressourcen für Webdesigner und -entwickler. Du findest mich auch auf deviantART und Instagram.
PayPal-Kaffeespende.

Eine Antwort auf "rukzuk – Das visuelle Responsive Webdesign Tool"

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Verpasse keine News!

Du erhältst ein kostenloses Bundle aus 50+ WordPress-Themes und PSD Device-Mockups.

1x pro Woche. Jederzeit kündbar.
Anzeige