Veröffentlicht

July 23rd, 2010

Kategorie

Design

Kommentare

Keine

LiModu Interface – Teil 2: Die Listenasicht

Endlich der zweite Teil der Interfacebeschreibung: Nachdem die Listenübersicht hier beschrieben wurde, möchte ich mich nun der eigentlichen Listenansicht widmen. Diese besteht im Wesentlichen aus zwei Teilen: Dem eingeblendeten Titel mit anschließendem Menü und der eigentlichen Liste.

Titel und Menü

Titel und Menü der Listenansicht

Dieses Bild stellt den ersten Teil der Listenansicht dar – die Titelanzeige mit anschließendem Menü. Beides wird beim Klicken auf eine der Listen eingeblendet. Menü ist jedoch ein zu großes Wort, da dieses derzeit nur das Veröffentlichen der Liste ermöglicht. Durch einen Klick auf den Button mit der Aufschrift Share öffnet sich ein Untermenü, in welchem man durch einfaches Klicken bestimmen kann, ob die Liste für nicht angemeldete Benutzer sichtbar ist oder nicht. Ist sie sichtbar, wird der entsprechende Link (Beispiel) dargestellt.

Dieser Teil der Listenansicht bedarf einiger Überarbeitung. So werden in Zukunft weitere Funktionen zum Exportieren, zum Einbinden in Webseiten und zum Durchsuchen der Tabelle hinzugefügt. Ich überlege den Titel in die Titelanzeige des Browsers zu verbannen um weiteren Platz – etwa für die Suchfunktion – zu sparen. Was meint ihr? Benötigt man an dieser Stelle den Titel?

Die Liste

Die Listenansicht

Dies ist die Listenansicht. Sie beherbergt alle Funktionen um die Liste bzw. Tabelle den eigenen Wünschen entsprechend anzupassen. Sie ist, wie auch die Listenübersicht, linkszentriert, da die Liste nach rechts erweitert werden kann und das Verstellen der Spaltenbreite mit zentrierter Tabelle schwierig ist.

In der ersten Zeile der Tabelle werden die Spalten zur besseren Bezeichnung (“Guck mal im Feld B-6!”) durch Buchstaben beziffert und sie bietet Funktionen zum Vertauschen einzelner Spalten und zum Verändern der Spaltenbreite. Vertauscht werden können die Spalten durch einen Klick auf das entsprechende Pfeilsymbol auf der linken und rechten Seite des Buchstabens. Zum Verändern der Spaltenbreite fährt man über den Rand zur nächsten Spalte, bis die Maus durch ein entsprechendes Icon anzeigt, dass an dieser Stelle die Breite per Drag’n'Drop verändert werden kann. Diese Funktion hört sich nicht einfach zu finden an, wurde jedoch den in anderen Programmen verwendeten Funktionen zur Veränderung der Spaltenbreite exakt nachempfunden und sollte den Benutzern somit kein Kopfzerbrechen bereiten.

In der Zeile darunter befindet sich die Überschrift der jeweiligen Spalte. Diese kann durch einfachen Klick in das entsprechende Feld verändert werden. Beim Überfahren eines Feldes mit der Maus erscheint ein Mac-übliches Zahnradsymbol. Klickt man auf dieses erscheint eine Funktion zum Löschen der Spalte. Gelöscht wird die Spalte jedoch erst nach einer Sicherheitsabfrage, um versehentliches Löschen zu vermeiden. Die Funktion zum Löschen wird in Zukunft vorraussichtlich in die darüberliegende Zeile verschoben, damit die Funktionen zum Verschieben, Verändern der Spaltenbreite und zum Löschen eindeutig von den Titeln getrennt sind.

Unter den Spaltentiteln befinden sich die Daten. Diese lassen sich ebenfalls durch Klicken in ein Feld einfach verändern. Jede Zeile besitzt eine Nummer zur besseren Bezeichnung der Felder. Diese Nummer erfüllt gleichzeitig die Funktion zum Verändern der Reihenfolge der Zeilen. Durch Überfahren mit der Maus wird durch ein entsprechendes Icon angezeigt, dass an dieser Stelle per Drag’n'Drop die Zeile verschoben werden kann. Fährt man mit der Maus über eine Zeile wird diese zur besseren Leserlichkeit blau markiert. Außerdem erscheint ein Zahnradsymbol am Ende der Zeile, welches dem Benutzer ermöglicht, die markierte Zeile zu löschen. Mit der Positionierung des Symbols bin ich derzeit noch etwas unzufrieden (Ideen?).

Schlußendlich ist noch der Sinn der beiden grünen Pfeile zu erklären. Durch einen Klick auf den rechten Pfeil lässt sich eine Spalte hinzufügen, durch einen Klick auf den unteren Pfeil eine Zeile. Beides kann jedoch auch durch die Navigation mit den Pfeiltasten innerhalb der Tabelle erreicht werden. Bearbeitet der Benutzer zum Beispiel ein Feld in der untersten Zeile und drückt die Pfeiltaste nach unten, wird automatisch eine weitere Zeile hinzugefügt.

Wie ihr seht ist das Interface voll funktionstüchtig und ich habe mir einige Gedanken gemacht, jedoch gibt es noch viele Baustellen. Hierzu gehören vor allen Dingen die richtige Positionierung der Zahnradsymbole und einige fehlende Funktionen. Über Vorschläge zu diesen beiden Punkten würde ich mich sehr freuen.

 

Veröffentlicht

July 9th, 2010

Kategorie

Design

Kommentare

Keine

LiModu Interface – Teil 1: Die Listenübersicht

Wie im ersten Beitrag zu LiModu versprochen, werde ich nach und nach das Interface von LiModu erklären und was ich mir bei der Gestaltung gedacht habe. Ich fange dabei mit der Listenübersicht an, da sie das erste ist, was ein neuer Benutzer von LiModu nach dem Login sieht. Hier sollte also schon der Grundaufbau vermittelt werden. Dabei ist Wert darauf gelegt worden, dass alles so einfach wie möglich gehalten wurde und alles was im Interface auftaucht auch eine echte Funktion hat und nicht nur dekoriert.

Interface Menü

Interface Menü

Im ersten Bild seht ihr das Menü des Interfaces. Dieses besteht aus den eigentlichen Links für die Navigation, einem grünen Rand am oberen Ende und links etwas Platz für eine ajaxtypische Ladeanzeige, die immer angezeigt wird wenn Daten zum Server gesendet oder abgeholt werden. Ist diese Anzeige aktiv, sollte das Fenster nicht geschlossen werden. Ich werde noch an einer entsprechenden Sperre arbeiten müssen, damit keine Daten verloren gehen.

Der obere Balken übernimmt verschiedene Aufgaben: Klickt man auf einen Link nimmt der Balken die Farbe von diesem an und der Pfeil wandert über den entsprechenden Menüpunkt. Auf der Webseite ist dieser Vorgang animiert – im Interface nicht, da es sich um verschiedene Seiten handelt und nicht um einen Javascript. Somit dient sowohl die Farbe als auch der Pfeil der Verdeutlichung, wo der Benutzer sich gerade im Interface befindet. Außerdem kann durch einen Klick auf den Rand das Menü verkleinert werden. Diese Funktion wird beim Überfahren des Balkens mit der Maus durch ein entsprechendes Icon angezeigt. Durch die Minimierung des Menüs kann die Arbeitsfläche weiter vergrößert werden, was etwa für kleine Displays Sinn macht.

Die Farben des Menüs spiegeln die Farben des Corporate Designs aller OnModu-Services wieder. Die Grundfarbe von LiModu ist dabei grün, da sie bei den eigentlichen Listen angezeigt wird, während dieser Blog etwa die Grundfarbe blau hat (derzeit leider noch etwas türkis – das wird noch geändert). Logos in entsprechenden Farben werden folgen.

Listenübersicht links

Linker Teil der Listenübersicht

Dies ist der linke Teil der Listenübersicht. Dieser Teil dient der Navigation durch die Listen, während der rechte Teil der Veränderung der Listen dient. Ich habe die Funktionen entsprechend aufgeteilt, da der Benutzer sich so beim Erreichen seiner gewünschten Liste nur auf den linken Teil konzentrieren muss und alle Elemente auf der rechten Seite nicht beachten muss. Jeder zusätzliche Button im Gesichtsfeld bedeutet zusätzliche Anstrengung für das Gehirn und Zugewinn von Komplexität. Erst beim Verändern einzelner Listen oder einer Kategorie werden die Buttons auf der rechten Seite interessant.

Die graue Balken der Überschrift erfüllt auf dieser Seite zwei Funktionen: Klickt man auf ihn, kann die Kategorie mit ihren Listen minimiert werden um die Anzahl sichtbarer Elemente zur Vereinfachung zu verringern. Das Rautezeichen vor dem Namen der Kategorie dient als Zeichen für die Drag’n'Drop Funktion. Mit gehaltenem Mausklick können an dieser Stelle die Kategorien vertauscht werden. Eventuell finde ich für diese Funktion noch ein besseres Symbol. Sowohl das Verschieben als auch das Minimieren der Kategorien werden durch eigene Icons angezeigt, wenn man über die entsprechenden Stellen mit der Maus fährt. Unter der Kategorieanzeige werden die entsprechenden Listen angezeigt. Sie erreicht man durch Klicken auf die Titel.

Listenübersicht rechts

Rechter Teil der Listenübersicht

Der rechte Teil dient, wie bereits erwähnt, der Veränderung von Kategorien und Listen. Dabei werden auch hier die Buttons nur durch Überfahren der Liste bzw. Kategorie sichtbar um die Anzahl der Buttons auf der Seite einzuschränken und somit die Komplexität zu verringern. Nur der Button zum Hinzufügen einer Kategorie ist ständig sichtbar. Klickt man auf diesen wird eine neue leere Kategorie mit dem voreingestellten Titel “Unbenannt” erstellt. Da die Kategorie sicht aber relativ genau an der Stelle befindet wo vor dem Klick der Button für die Erstellung befand, muss der Nutzer keine weite Wegstrecke mit der Maus zum Button für die Umbenennung der Kategorie zurücklegen – alles wie Herr Fitt sich das gedacht hat.

Neue Listen lassen sich per Klick auf den Button in der Kategoriezeile erstellen oder wahlweise bei leeren Kategorien auf den Link mit der Aufschrift “Noch keine Liste vorhnaden – hier klicken!”. Kategorien lassen sich nur löschen, wenn sie keine Listen beinhalten. Andernfalls wird der Button für das Löschen nicht angezeigt. Dies verhindert das Löschen von Kategorien, welche noch Listen beinhalten.

Bei allen Löschvorgängen wird zur Sicherheit noch eine Warnung ausgegeben, die bestätigt werden muss. Dies dient zur Prävention gegen ausversehen gelöschte Elemente. Die Umbennen-Funktionen öffnen ein eigenes Eingabefenster, in welches der neue Titel eingegeben werden kann. Diese Funktion möchte ich eventuell so umgestalten, dass das Eingabefeld direkt dort ist, wo sonst die Titel sind.

Ich hoffe, dass der erste Teil der Beschreibung des LiModu Interfaces verdeutlichen konnte, was bei der Gestaltung wichtig war und zum Verständnis der Navigation beiträgt. Alle Effekte können nicht genau beschrieben werden – aber Ausprobieren kostet ja nichts! Im nächsten Teil werde ich die Listenansicht beschreiben.

 

Veröffentlicht

July 5th, 2010

Kategorie

Finanzen

Kommentare

2 Kommentare

Ausgaben für Juni 2010

Hiermit möchte ich eine kleine Dokumentation über meine Ausgaben und bald hoffentlich auch über die Einnahmen beginnen. Zu dieser wird gehören, dass ich jeden Monat – ähnlich wie es bereits andere Blogs machen – die einzelnen Posten erwähne und erläutere. Anfangen möchte ich dabei mit dem Monat Juni, da ich in diesem das erste Produkt LiModu veröffentlicht habe. Auf die Benutzerzahlen und Statistiken werde ich vorerst jedoch nicht eingehen, da ich bei beiden Domains kein Analytics installiert habe. Wenn ich davon rede, dass man Google nicht seine Daten einfach so anvertrauen soll, wäre es scheinheilig selbst Analytics einzusetzen. Bis ich also einen schönen Ersatz für die Besucherstatistik gefunden habe, bleibt diese unerwähnt.

In diesem Monat gab es hauptsächlich zwei große Kostenfaktoren: Da sind zum einen die Server von AWS (Amazon Web Services) und zum anderen die Anwaltskosten für die Überprüfung der LiModu AGB auf Gefährdung durch Abmahnungen.

Für die Server (einer für die Dateien, einer für die Datenbank) hat AWS mir im Juni $ 167.83 berechnet. Das sind 133.91 €. Hinzu kommen für beide Domains (OnModu.com & LiModu.com) jeweils 0,79 €.

Für die Überprüfung der AGB habe ich den Pauschalpreis von 238 € gezahlt. Beinhaltet ist eine dreimonatige Kontrolle der AGB auf aktuelle Veränderungen der Gesetzeslage. Eine Überprüfung der AGB war mir insofern wichtig, da Abmahnungen sehr teuer werden können und die Geschäftsbedingungen die Hauptangriffspunkte sind. Vielen Dank für den guten Kontakt an die Kanzlei PMS.

Insgesamt ergeben sich für den Juni also vorerst Kosten von 373,49 €. Ich hoffe, dass diese sich irgendwann lohnen werden.

 

Veröffentlicht

June 26th, 2010

Kategorie

Allgemein

Kommentare

Keine

Ressourcen für die Erstellung von OnModu und LiModu

An dieser Stelle möchte ich mich bei allen Anbietern von Scripten, Grafiken und Frameworks bedanken, die ich für die Erstellung der Seiten OnModu und LiModu genutzt habe und die derzeit auf den Seiten zu finden sind. Daher hier eine kleine Aufzählung:

Grafik:

  1. Für fast alle Überschriften beider Seiten benutze ich derzeit die Schriftart Museo 300, die von Jos Buivenga erstellt wurde. Erhalten kann man sie auf www.exljbris.nl.
  2. Auf LiModu werden drei verschiedene Icons verwendet, zwei Pfeile und ein Zahnrad. Alle drei sind aus dem Nixus Icon Pack von Tutorial9.
  3. Die Ladeanzeigen bei Ajaxfunktionen wurden mit der Seite Ajaxload generiert.

Technik:

  1. Für LiModu benutzte ich derzeit die beiden Dienste EC2 und RDS der Amazon Web Services. Mal sehen, wie zufrieden ich auf Dauer mit dem Cloud Hosting bin.
  2. OnModu und alle Domains werden derzeit von Dreamhost verwaltet. Sehr günstiger und schöner Service – für große Projekte jedoch eher nicht geeignet.
  3. Derzeit wird Mootools als Javascript Framework eingesetzt. Nach kurzer Einarbeitung kommt man wirklich gut damit aus. Bin mir nicht sicher, ob ich bei anderen Projekten eventuell mal jQuery ausprobieren sollte.
  4. Für das richtige Zusammenpacken der JS-Scripte verwende ich diesen Code von Pseudelia.
 

Veröffentlicht

June 23rd, 2010

Kategorie

Design

Kommentare

Keine

Aufbau der Startseite von LiModu

LiModu - Frontpage

LiModu - Frontpage (Stand: Juni 2010)

Wie versprochen hier der erste Beitrag darüber, was ich mir beim Aufbau des Services gedacht habe. Dabei möchte ich als erstes auf den Hauptteil der Startseite eingehen. Dieser kann grob in zwei verschiedene Teile getrennt werden:

Der erste Teil ist ein dreizeiliger Text, der mit so wenig Worten wie nötig erklären soll, was LiModu kann und wieso wichtig ist, dass LiModu genau das kann. Oberstes Gebot bei der Gestaltung dieses Abschnitts war, dass der Text sehr zentral dargestellt wird um direkt in’s Auge zu fallen und dem Benutzer nach dem Lesen klar sein soll, welche Probleme LiModu löst.

Daran anschließend folgen vier Abschnitte, die jeweils einzelne wichtige Themen erläutern, die bei der Benutzung und Gestaltung von LiModu im Vordergrund stehen. Ich habe mich für die Themen Multifunktional, Online, Einfach schön und Ehrlich entschieden. Sie erscheinen mir derzeit die zentralen Aspekte für die Nutzung des Services. Das diese Aufteilung nicht von ungefähr kommt, möchte ich anhand einiger Beispielen anderer Webservices verdeutlichen.

Schaut man sich zum Beispiel Postmark an, sieht man einen ähnlichen Einleitungstext. Dieser erklärt im ersten Satz, was Postmark macht und in einem zweiten Satz, welche Probleme für den Kunden somit gelöst werden. Durch diese Kurzfassung können sich die Besucher schnellstmöglich ein Bild über die Funktionen des Services machen. Ergänzt wird die Einleitung durch ein Bild des Services, welcher bei LiModu derzeit noch nicht vorhanden ist. Die sechs ausgewählten Funktionen im zweiten Teil werden ebenso nur genannt und in aller Kürze durch einen Satz erklärt.

Postmark - Einleitungstext

Postmark - Themen

Ein ähnlicher Aufbau ist bei Campaignmonitor zu finden. Zuerst wird in der Einleitung erläutert, was der Service kann bzw. für wen er gedacht ist und anschließend werden im zweiten Teil die wichtigsten Funktionen und der Preis erläutert. Dieser wird auf der LiModu – Startseite durch einen einzelnen Satz dargeboten.

Campaignmonitor - Einleitung

Campaignmonitor - Themen

Campaignmonitor - Themen

Natürlich möchte ich mite hier ebenfalls als Vorbild in der Gestaltung der Startseite anführen. Sie haben meiner Meinung nach einen der schönsten Einleitungstexte verfasst, welcher durch ein Bild des Services ergänzt wird. Darunter finden sich wiederrum wichtige Ansichten und Themen, die bei der Benutzung von mite eine Rolle spielen.

Mite - Themen

Mite - Einleitung

Es lassen sich noch sehr viele weitere Beispiele für das gleiche Prinzip finden. Daher möchte ich hier nur noch kurz drei weitere Screenshots der Seiten balsamiq, stickermule und beanstalk zeigen:

Balsamiq

Stickermule

Beanstalk

Ich hoffe, man konnte durch diesen Beitrag erkennen, was ich mir beim Aufbau der Startseite gedacht habe: Als soll so übersichtlich wie möglich sein und die wichtigsten Themen sollen dem Benutzer direkt klar werden. Dabei folge ich dem – derzeit anscheinend modernen – Aufbau weiterer hervorragender Webservices.

Ein Gedanke für die Zukunft der Startseite möchte ich am Ende noch erwähnen: Ein passendes Bild als Eye-Catcher – wie es viele der genannten Webservices haben – steht noch aus. Ich bin mir nur nicht sicher, ob ich dieses Bild zugunsten einer Anzeige von Kundenmeinungen weglassen möchte. Diese Kundenmeinungen könnten so aussehen, dass jeder Benutzer die Chance erhält kurz zu erklären wofür er LiModu nutzt. Das würde den Punkt der Multifunktionalität unterstreichen und dem Webseitenbesucher den Nutzen von LiModu weiter verdeutlichen. Was meint ihr – Bild oder Kundenmeinung?

 

Veröffentlicht

June 14th, 2010

Kategorie

Allgemein

Kommentare

2 Kommentare

Ideenfindung: Welche Gedanken stecken hinter LiModu?

Am Anfang einer Unternehmung steht immer die Idee. Sie ist zentraler Bestandteil aller folgenden Aktivitäten. Aus diesem Grund möchte ich in diesem – zugegeben etwas längeren – Beitrag ausführlich darauf eingehen, wie ich zur Idee hinter LiModu gekommen bin.

Ich denke, niemand wird widersprechen wenn ich sage, dass ein Webdienst immer ein Problem lösen sollte – insbesondere, wenn man zu einem späteren Zeitpunkt Geld für die Nutzung dieses Dienstes verlangen will. Andernfalls ist ein Scheitern vorprogrammiert. Niemand möchte für etwas bezahlen, was ihm das Leben nicht vereinfacht bzw. es schöner gestaltet. Um ein solches ungelöstes oder schlecht gelöstes Problem zu finden kann man verschiedene Wege gehen – Brainstormen, die Konkurrenz beobachten, aus eigenen Erfahrungen schöpfen usw…

Phase 1 – Erste Gedanken:

In meinem Fall habe ich mich umgesehen, welche Probleme bereits von anderen Anbietern behoben werden und bin Ende letzten Jahres auf Dienste wie Basecamp von 37Signals gestoßen. Die erste Idee war für mich, eine Software für den deutschen Markt umzusetzen, die Basecamp relativ ähnlich sein sollte. Besser als Basecamp wollte ich sein, indem ich mein Produkt mit mehr Funktionen ausstatte. Zu diesem Zeitpunkt hatte ich die minimalistische Philosophie hinter 37Signals demnach noch nicht verstanden. Erst mit der Zeit wurde mir bewusst, dass es eine Fülle von Projektmanagement Angeboten gab – also verwarf ich die Idee und suchte mir eine Nische:

Phase 2 – Nische finden:

Der Gedanke hinter meinem zweiten Anlauf zur Ideenfindung war, sich eine spezifische Nische zu suchen und keine allgemeinen Projekte zu behandeln – der Markt für diese scheint ohnehin gesättigt. Naheliegend war zu diesem Zeitpunkt eine Ausrichtung in Richtung Entwicklungsteams. Das heißt, dass Produkt sollte es Entwicklern ermöglichen, ihre Projekte komplett online und innerhalb einer einzigen Entwicklungsumgebung realisieren zu können. Dabei war geplant, die drei Komponenten eines Onlineeditors, eines Bugtrackers und einer Versionierungssoftware auf einem Portal zusammenzufassen. Das Produkt sollte dabei so gestaltet sein, dass es um weitere Module erweiterbar ist, welche ich später programmieren wollte. Das Problem an diesem Produkt, auch wenn ich es weiterhin im Hinterkopf behalte, ist, dass es sich auf zu viele verschiedene Probleme konzentriert anstatt ein Problem hervorragend zu lösen. Diese Erkenntnis zog ich aus dem Buch Rework und aus der Betrachtung von mite, einem Onlinedienst, welcher sich einzig und allein auf die hervorragende Lösung des Problems der Zeiterfassung konzentriert. Hinzu kommt, dass ich derzeit ein Einzelunternehmer bin. Aus diesem Grund wollte ich mich weiter auf nur ein Problem beschränken:

Phase 3 – Nach Rework:

Nachdem mir also klar geworden war, dass ich nur ein spezifisches Problem lösen möchte, dachte ich nach, welches essentielle, persönliche und einfache Problem meiner Meinung nach nicht gut genug gelöst wird. Auf das Problem der Listen- bzw. Tabellenerstellung und Verwaltung bin ich dann aus mehreren Beobachtungen heraus gekommen:

  1. Ich selbst plane eigene Feiern oder Ausflüge immer mithilfe von Listen. In diesem Listen stehen die Namen, der Teilnehmer zusammen mit weiteren Informationen: Ob jemandem Bescheid gesagt wurde, ob derjenige geantwortet hat, wann er kommt, was er mitbringt usw. Daraus ließ sich für mich sehr gut erschließen, was noch eingekauft und vorbereitet werden muss. Die Nutzung von Excel kam mir dabei jedoch stets zu komplex für meine Listen vor, weswegen ich den Texteditor bevorzugte und mit der Tabulatortaste arbeitete. So ließ sich (falls jemand wissen wollte, wer sonst noch kommt und kein Geschenk hat) die Tabelle außerdem schnell kopieren und per Messenger verschicken. E-Mails und Dateien waren zum Teilen also nicht nötig.
  2. In meinem Praktikum war es gebräuchlich, alle Daten in Listen zu sortieren die entweder in Excel Tabellen zusammengefasst als E-Mail herumgeschickt wurden, oder online in Googles Texte & Tabellen eingepflegt und so verteilt wurden. Beide Lösungen erfüllen ihren Zweck, sind jedoch meiner Meinung nach nicht optimal. Die Programme sind durch ihre vielen Funktionen überladen. Sie konzentrieren sich nicht auf die Lösung des Problems der Informationsorganisation, sondern wollen verschiedene Probleme lösen, welche meistens Rechnungen beinhalten. Darunter leidet der einfache Umgang mit den Daten. Auf die Frage, wer gerne mit Excel arbeitet, wird es meiner Meinung nach nicht sehr viele Antworten geben. Das Herumschicken per E-Mail macht das Informationsmanagement zusätzlich unübersichtlich. Man muss darauf achten, wer welche Version der Dateien hat und es gibt keinen zentralen Speicherort. Beim Gebrauch von Googles Texte & Tabellen sollte sich der Benutzer außerdem die Frage stellen, ob er der Datenkrake gerne seine – meist sensiblen – Daten in leicht auszulesender tabellarischer Form zukommen lassen will.
  3. Andere stehen vor ähnlichen Problemen: Als ich einen Freund von mir dabei zusah, wie er eine Reise in tabellarischer Form in Excel plante, indem er jeden Tag mit verschiedenen Aktivitäten und deren Kosten beschrieb und diese Tabelle anschließend per E-Mail an seine Mitreisenden sandte, war mir klar, dass auch andere Personen Excel in Verbindung mit E-Mails nur für die Informationsorganisation nutzen und nicht für komplizierte Rechenvorgänge innerhalb großer Organisationen. Aus Redundanzgründen lasse ich weitere Beispiele für Beobachtungen meiner Freunde an dieser Stelle vorerst weg.

Aus diesen Beobachtungen ergab sich also das unzureichend gelöste Problem: “Zentrale Informationsorganisation in tabellarischer Form”. Nur kurz möchte ich auf ein paar wesentliche Vor- und Nachteile dieses Problems eingehen:

Als Vorteile der Lösung dieses Problems lassen sich noch einige Punkte hervorheben: Durch die hohe Flexibilität von Listen bzw. Tabellen lassen sich verschiedenste Kleinstprobleme lösen, was zu einer sehr großen Zielgruppe führt. So könnte LiModu interessant für Leute sein, die – ähnlich wie ich – einfach nur eine Feier planen wollen oder ihr WM Tippspiel in tabellarischer Form aufbereiten wollen, die Passwörter ihrer Firma online für alle verfügbar gliedern wollen oder ihre dieses Jahr gesehenen Kinofilme abspeichern wollen. Webmaster werden in zukunft die Möglichkeit haben, die Tabellen ihrer Webseiten über Widgets direkt zu bearbeiten.

Natürlich gibt es auch Risiken, die gegen das Produkt LiModu sprechen: Zum einen muss erst ein Produkt entworfen werden, welches diese Probleme einfacher, bequemer und zufriedenstellender als die oben genannten Produkte löst. Zu diesem Punkt sei gesagt, dass es sich derzeit um die erste Version von LiModu handelt und erst mit der Zeit und dem Gespräch mit den Nutzern ein Produkt entstehen wird, welches diesen Ansprüchen genügt. Da mir die Kommunikation mit den Nutzern äußerst wichtig ist und das Produkt in Zusammenarbeit mit diesen geformt werden soll, habe ich mich entschieden, LiModu in einem so frühen Stadium zu veröffentlichen. Weitergehend könnte dieses Problem zu banal erscheinen, um Leute dazu zu bewegen, dafür Geld auszugeben. Die Zeit wird zeigen, ob das Problem so zufriedenstellend gelöst werden kann, dass ein kleiner Prozentsatz von Benutzern dazu bereit ist, für einen solchen Dienst zu zahlen oder dafür in Kauf genommen wird, weiter die Daten anders zu organisieren.

 

Veröffentlicht

June 10th, 2010

Kategorie

Allgemein

Kommentare

Keine

Veröffentlichung der ersten Version von LiModu

Endlich ist es soweit und ich fasse den Mut, die erste Version von LiModu öffentlich zu machen. Entsprechend meines Namensystems bedeutet der Name so viel wie „Listen Modul“ und verrät genau, was der Service können soll: Der Nutzer soll Listen einfach online erstellen, verwalten und teilen können. Mehr Informationen zum Service gibt es auf der Startseite bzw. der Tour.

In den folgenden Beiträgen dieses Blogs werde ich schildern, wie ich überhaupt auf die Idee gekommen bin, was ich mir beim Design des Interfaces und der Startseite gedacht habe, welche Hilfsmittel ich woher bezogen habe und einen Ausblick auf Funktionen geben, die meiner Meinung nach noch dringend fehlen oder sinnvoll wären.

 

Veröffentlicht

May 3rd, 2010

Kategorie

Allgemein

Kommentare

Keine

Domainwechsel: Aus BloModu wird OnModu

Seit gestern habe ich meine Zeit damit verbracht, den Blog von BloModu.com auf OnModu.com umzuziehen und das Design an kommende Projekte anzupassen. In erster Linie habe ich die Entscheidung für den Umzug gefällt, da mir der Name BloModu (Kurzform von Blog Module) nicht zugesagt hat. Es handelt sich schließlich nicht um ein Blog-Modul, sondern um einen Blog über die zukünftig erscheinenden Module. Die Domain OnModu (Kurzform für Online Modules) erscheint mir für diese Funktion besser geeignet. Neben dem Blog wird es auf dieser Domain später eine Übersicht über die verschiedenen Module geben.

Außerdem läuft der Blog nun wieder auf WordPress. Die Zeit, die in ein eigenes Blogsystem gesteckt werden muss, kann besser in die Projekte investiert werden. Die aktuelle E-Mail Adresse ist Benjamin@OnModu.com und das Twitterprofil lautet dementsprechend von nun an @OnModu.

 

Veröffentlicht

April 12th, 2010

Kategorie

Allgemein

Kommentare

Keine

Der Name OnModu

Da das erste Produkt in nächster Zeit voraussichtlich in’s Netz gestellt wird, möchte ich noch kurz erklären, woher der Name OnModu überhaupt kommt.

Da ich plane, im Laufe der Zeit verschiedene Services im Internet zu veröffentlichen, wollte ich im Domainnamen eine erkennbare Verbindung zwischen den Tools schaffen. Die Scout24- oder die VZ-Gruppe geben ein gutes Besipiel für dieses Vorgehen ab, indem Sie an alle Produkte ihre gleichbleibende Bezeichnung hängen. Das soll, genau wie die bereits vorgestellte Farbwahl, zur Corporate Identity bzw. dem Corporate Design beitragen.

Der Anhang Modu steht dabei für Module und wird durch den Großbuchstaben M am Anfang von der Produktbezeichnung Abgehoben. On ist im Fall OnModu die erste Silbe von Online. Ausgeschrieben würde der Domainname demnach Online Modules bedeuten. Würde ich etwa einen Service zum Projektmanagement (nein, ich werde keinen Basecamp-Clon veröffentlichen) planen, würde der Domainname wahrscheinlich ProModu heißen.

 

Veröffentlicht

April 7th, 2010

Kategorie

Coding

Kommentare

Keine

Nutzt Tabellen – keine DIVs!

Wie oft stößt man im Internet auf der Suche nach CSS Fragen darauf, dass Tabellen die Wurzel allen Übels ist? Erst vor Tagen fragte mich ein Freund, wie man mit DIVs zwei Spalten nebeneinander bekommt. Bei genauerer Nachfrage wollte er einen einfachen Login bauen. Wieso sollte man da DIVs nutzen? Tabellen formatieren Spalten, etwa für Formulare, wesentlich einfacher, lesbarer und mit weniger (CSS) Code als es mit DIVs jemals möglich sein wird.

Mein Rat zu der Sache ist: Wenn es passt, sollte man auch zu Designzwecken Tabellen verwenden. Das betrifft insbesondere Formulare und Tabellen. Egal was andere sagen, man sollte immer den Weg nehmen, der für sich selbst am besten ist. Wer denkt, dass eine Webseite durch so ein hintergründiges Problem weniger erfolgreich sein wird, sollte sich Seiten wie Craigslist oder Amazon ansehen, die Tabellen für ihr Design verwenden.

Ein Grund für DIVs ist die bessere semantische Markierung einzelner Inhalte, aber wozu sollte ein Formular semantisch gekennzeichnet werden? Google ist es beim Spidern herzlich egal, ob die Loginbox eine Loginbox oder ein Anmeldeformular ist – oder ist schonmal ein Besucher auf eure Seite gelangt weil er nach “Passwort bestätigen” gegoogelt hat?

 

Veröffentlicht

April 1st, 2010

Kategorie

Design

Kommentare

Keine

Trick zum schönen Farbkonzept

Ein stimmiges Farbkozept für eine Webseite zu entwickeln kann wirklich Nerven kosten. Daher hier ein kleiner Trick, mit dem fast immer 9 zueinander passende Farben gefunden werden können. Ich glaube, ich habe diese Taktik vor Jahren irgendwo gelesen, finde die Quelle aber nicht mehr.

Nimmt man eine beliebige Farbe als Hex-Code hat man folgendes: #90BB30 (die Farbe der Links dieses Blogs). Unterteilt man diese Farbe nun in einzelne Farbwerte und ordnet diese neu, erhalten wir 8 weitere passende Farben:

Unterteilen: # 90 BB 30
Ordnen:
#BB9030
#9030BB
#BB3090
usw…

Ich hoffe der Trick nutzt etwas und falls jemand die Quelle hat, bitte gerne schreiben. Die wird dann nachgetragen.

 

Veröffentlicht

March 24th, 2010

Kategorie

Coding

Kommentare

Keine

Open Source: smoothJump für alle

Kurz zum Effekt: Die Navigation über die rechte und linke Pfeiltaste soll das Springen zum nächsten oder vorherigen Beitrag vereinfachen. Dabei wurde auf die Erhaltung normaler Scrollfunktionen (etwa durch die obere und untere Pfeiltaste) geachtet.

Da ich mir dachte, dass die Tastatursteuerung dieses Blogs eventuell auch für andere Projekte nützlich sein könnte, habe ich den Code in einer kleine Open Source Klasse zusammengefasst. Die Demo sollte sich einigermaßen gut selbst erklären und einfach einzubinden sein. Falls trotzdem Fragen auftreten, einfach als Kommentar zu diesem Beitrag verfassen oder mich über Twitter löchern. Ich helfe gern!

smoothJump (Demo): Download
Hinweis: Die mitgelieferte Version von Mootools ist nicht komprimiert. Das sollte bei Bedarf selbst auf der Mootools Webseite gemacht werden.

 

Veröffentlicht

March 23rd, 2010

Kategorie

Allgemein

Kommentare

Keine

David H. Hansson bei TWisT

David Heinemeier Hansson bei TWiST zu gucken sind garantiert keine fehlinvestierten zwei Stunden. Wer Signal vs. Noise verfolgt, oder eines der beiden Bücher Rework oder Getting Real gelesen hat, wird zwar schon viele der Argumente und Ansichten kennen – die Diskussion zwischen Hansson und dem Mahalo Gründer Jason Calacanis macht das Video jedoch besonders. An vielen Stellen sind Hanssons Argumente einfach wesentlich realer und bodenständiger als die arroganten Calacanis-Argumente.

Anmerkung: Beim genaueren Betrachten der Ansichten wird übrings deutlich, dass die Leute von 37 Signals teilweise zu radikal sind und nicht immer recht haben. Dazu werde ich jedoch noch einen extra Beitrag schreiben.

 

Veröffentlicht

March 12th, 2010

Kategorie

Allgemein

Kommentare

Keine

Wer hier schreibt

Damit ihr wisst, wer hier überhaupt schreibt: Mein Name ist Benjamin Kowalski, ich bin 23 Jahre alt und schon seit Jahren im Internet aktiv. Ich habe diverse kleinere Projekte entwickelt, welche mir verschiedene Techniken aus der Webentwicklung, dem Affiliatemarketing und dem Designen bzw. dem Usability-Design näher gebracht haben. Ich schreibe PHP, MySQL, JS, HTML und CSS. Gearbeitet wird an einem Macbook pro.

Ich habe ein abgeschlossenes Bachelorstudium in angewandten Kognitions- und Medienwissenschaften und derzeit versuche ich, meine Selbstständigkeit voranzutreiben. Weitere Profile gibt es hier: Facebook, Xing, Twitter

 

Veröffentlicht

March 9th, 2010

Kategorie

Allgemein

Kommentare

Keine

Los geht’s!

Was gäbe es für ein schöneren Zeitpunkt zur Eröffnung dieses Blogs? Gerade habe ich Rework von 37Signals gelesen und mich vom Kapitel Start making something dazu motivieren lassen, diesen Blog online zu stellen.

Was soll dieser Blog? Ich plane, in naher Zukunft ein oder mehrere Onlinetools zu veröffentlichen, an welchen ich bereits seit einigen Wochen arbeite. Dieser Blog soll den Prozess der Veröffentlichung begleiten. Wenn die Tools spruchreif sind, werden sie dementsprechend hier zuerst vorgestellt.

Nebenher werden Themen wie Usability, schicke Designs, nette Grafiken, Webanwendungen und Programmiertechniken eine weitere Rolle spielen. Alles was interessant und themenbezogen ist.