FiftyFifty: Mit One-Pagern Ideen visualisieren

04.11.2015 | Idee

One-Pager und Landing-Pages eignen sich bestens, um Ideen schnell ins Web zu bringen und ein erstes Feedback zu sammeln.

Inzwischen habe ich mir angewöhnt, Ideen möglichst schnell in etwas klickbares zu verwandeln, bevor sie mir wochenlang im Kopf rumschwirren und mich von wichtigeren Dingen abhalten. Letzte Woche schwirrte mir die Idee zu FiftyFifty im Kopf herum, eine Verbraucherberatung, bei der man Teile (fiftyfifty) des eingesparten Geldes für gute Zwecke spenden kann. Ob die Idee nun tragfähig ist oder nicht: Wichtig ist mir eine möglichst schnelle erste Visualisierung, mit der man arbeiten oder eben genau das auch lassen kann.

Also habe ich einen Teil des Wochenendes mit dem Bau einer simplen HTML-Landing-Page verbracht. Ursprünglich wollte ich ein fertiges Template umbauen, allerdings ist so ein Umbau meistens arbeitsintensiver und langweiliger, als die Seite einfach neu zu erstellen. Beim Design habe ich mich sehr stark an das bereits bestehende Simplex-Theme angelehnt. Herausgekommen ist die folgende FiftyFifty-Landingpage:

FiftyFifty: Landingpage vom Wochenende

Zwar arbeite ich inzwischen vermehrt mit Wireframe-Tools (Balsamiq) oder direkt mit Screendesigns. Allerdings haben HTML-Seiten immer noch den Charme, dass man nebenher noch experimentieren und neue Techniken ausprobieren kann. FiftyFifty funktioniert beispielsweise auch sehr gut mit dem Smartphone, obwohl ich entgegen der Good Practice zunächst die Desktop-Variante und erst im Anschluss die Mobile-Variante gebaut habe. Dass die Mobile-Variante gut funktioniert liegt auch an dem neu entdeckten Slideshow-Script Flickity, dass sich auf Smartphones wunderbar swipen lässt. Einfach mal die Seite FiftyFifty mit dem Smarthphone ausprobieren.

Eine weitere Entdeckung ist die Plattform Freepik, auf der man kostenfreie (CC) Illustrationen und Grafiken findet. Ansonsten sind wieder meine Standard-Tools Fontello, colourlovers und smoothscroll zum Einsatz gekommen.

Also, für ein halbes Wochenende ist das Ergebnis allemal in Ordnung, und man kann es einfach mal rumschicken, um ein erstes Feedback zu sammeln…

Mehr davon? In der Artikelsammlung "Idee" gibt es weitere spannende Beiträge. Wenn du ein Web-Projekt von A-Z erstellen willst, findest du im Themenüberblick viele Artikel zu jedem Schritt.

blog comments powered by Disqus