Dons Erinnerungen – Layoutentwurf

17. April 2008 um 23:03 von donvanone | Kommentar abgeben | Trackback

Meine Idee wird immer konkreter, hier mal nochmal kurz, worum es geht:

Ich will meine Vergangenheit für mich selbst aufbereiten, um dann in späteren Jahren schön zurückblicken zu können und mich nicht ärgern müssen, dass ich alles wieder vergessen habe.
Ausgangspunkt sind hier jeweils Erinnerungsgegenstände, die ich aufgehoben habe, die dann abfotografiert und mit der Geschichte zum “Müll” versehen werden. Das ganze geht dann online auf ein eigenes Blog.
Da ich aber nicht meine ganzen privaten Sachen online haben will, wird es nur die Bilder und einen veröffentlichbaren Text für jedermann zu lesen geben. Für registrierte Leser (müssen von mir genehmigt werden, sind also nur Leute, die mich wirklich persönlich kennen, reine Internetbekanntschaften brauchen sich also schonmal keine Hoffnungen machen) gibt es noch eine zweite Spalte an Text, die die privateren Teile der Geschichte befasst.
Beide Spalten können separat kommentiert werden, die Kommentare zu den privaten Sachen können auch wieder nur registrierte Leser lesen.

Wie hier schon geschrieben, ist das mit den Spalten und den Leseberechtigungen dank eines passenden Plugins kein Problem, ich kann die private Spalte sogar nur für einzelne Benutzer freigeben, z.B. nur für die, die dabei waren. Hier setzt auch gleich der zweite mir wichtige Punkt ein: Warum sollten die, die das eh erlebt haben, den ganzen Dreck lesen? Na um mir einen Gefallen zu tun und meine Erinnerungslücken in den Kommentaren zu schließen.

Heute hab ich mich dann mal an einen ersten Entwurf gesetzt. Das ganze soll sehr schlicht aussehen, das Bild vom Erinnerungsstück dominieren. Heraus kam das hier:

Erinnerungen - Designentwurf 1

(Hier klicken für die Großversion. Ja, das wird so breit. Wer keinen so breiten Bildschirm hat, hat Pech gehabt. Die Seite muss nicht massenkompatibel sein…)

Was man sieht: Oben groß das Bild zum aktuellen Artikel, dann die beiden Spalten (links die öffentliche, rechts die private) mit zugehörigen Kommentaren drunter (spaltenübergreifend zeitlich sortiert, da es ja auch sein kann, dass ein privater Kommentar sich auf einen öffentlichen bezieht. Ja, momentan ist nicht ersichtlich, wo ich privat kommentiere und wo öffentlich, das könnte man noch in die Buttons mit reinpacken). Zwischen den Spalten hats nochmal ein kleines Bild, um ein Detail hervorzuheben, oder aber ein zweites, ganz anders Bild einzufügen. Außer den beiden Bildern wird es keins geben. Und es werden immer genau zwei sein. Also sehr einheitliche Seiten, ganz streng.
Rechts und Links von dem großen Bild gibt es jeweils drei kleinere Bilder. Die drei links sind zu den drei vorherigen Beiträgen verlinkt, die drei rechten mit den drei nachfolgenden. So kann man munter von einem Artikel zu einem anderen navigieren.

Was noch fehlt ist sowas wie Impressum, Link zum Feed, Suchmaske und so weiter. Die mach ich wohl irgendwie auklappbar nach ganz unten oder ganz oben, so dass sie nicht stören. Überladene Sidebars wie hier auf DonsTag wirds auf jeden Fall nicht geben…

Auf die Startseite packe ich vielleicht nur diese kleinen Bildchen wie bei der Vor- und Zurück-Navigation. Ganz ohne Texte, die kriegt man erst in der Einzelansicht. Dafür kommen auf die Startseite dann ganz viele (alle?) Bilder, irgendwie gruppiert (nach Monat oder Woche, je nachdem, wie oft ich da was schreibe).

Fragen, Anmerkung, Verrisse (Fluffi…), Lob, Kritik?

 
Madonha:

Schade, dass man hier noch nicht so richtig sieht, wie es funktioniert. Ich bin gespannt auf die Ausprobier-Version. Gehört mein Frosch und das lecker dekorierte Erdnussbutterbrot auch zu deinen Erinnerungen?

antwortenReply to this comment
 
 
donvanone:

@Madonha: Ja, das Brot hat auch eine besondere Geschichte. Gehört zu einem von 7 “Brot mit was drauf”-Bildern, die mitunter mit umliegenden Zeug dekoriert wurden. Die Brote liegen aber nicht in meiner Erinnerungsschatzkiste…

antwortenReply to this comment
 
 
Madonha:

So wie das aussieht, konnte man es doch auch nicht lange liegen lassen, jedenfalls nicht, wenn man Erdnussbutter liebt!

antwortenReply to this comment
 
 
Fluffi:

Ok, wenn du mich schon in die Kategorie “Verisse” einsortierst, dann mach dich auf was gefasst ;)
Ich finde auch, dass die Trennung nicht ganz klar wird, ich hätte mir durchaus eine leichte Trennlinie vorstellen können bzw. besser eigentlich eine leichte (!) farbliche Teilung der Seite. Darf natürlich nicht zu stark sein, sonst denkt man, dass die beiden Seiten nichts miteinander zu tun haben. Die nicht erkennbare Trennung kann auch gefährlich sein. Nimm z.B. mal an, dass jemand etwas ganz privates in das linke Kommentarfeld schreibt, weil er sich denkt “och, zwei Kommentarfelder, da nehm ich doch einfach mal das (leserichtungs-erste) linke”.

Und zum technischen: ich bin mir ziemlich sicher, dass du dir mit dem mittig platzierten Bild im Text keinen Gefallen tun wirst. Wo ist das ausgerichtet? Wie/so umfließt sowohl die linke als auch die rechte Spalte das Bild? Den Quellcode schau ich mir an… ;)

Aber auch noch ein Lob, sonst denkt hier wirklich jeder, dass ich nur herummeckern kann: find’s grundsätzlich schick, so schlicht. Die Startseite nur aus Bildern find ich auch gut, vielleicht kannst du da den Titel oder eine Kurzbeschreibung per Js-Tooltip anzeigen, das erhöht den “Stöbercharakter” auf der ersten Seite.

antwortenReply to this comment
 
 
donvanone:

@Fluffi: Ich hatte vorher ne weiße Trennlinie drin, dann sah das aber (weil die Linie auch bei den Kommentaren war) aus wie ein weißes Kreuz auf schwarzem Grund und tatsächlich wie ein Nachruf auf mein Leben. Doof.
Und da die rechte Spalte ja eh nur eingeweihte Personen sehen können, wissen die dann einfach bescheid, wie es gemeint ist. Muss ja nicht so intuitiv sein, das jeder Google-Besucher-Depp sofort zurecht findet. Und das “Bescheid wissen” hilft dann auch, das richtige Kommentarfeld zu benutzen. Zumal ich ja noch “öffentlichen Kommentar abschicken” und “privaten Kommentar abschicken” in die Buttons schreiben will.
Farbe kommt mir hier nicht rein (Links werden grau, hab ich mir so gedacht).
Zum technischen: Ja, das mit dem Bild in der Mitte ist kein gefallen an mich selbst, sondern eine Herausforderung. Ich will ja auch ein wenig experimentieren und verzweifeln. mein Ansatz wäre, das Bild absolut ans untere Ende der beiden Textspalten zu positionieren (also mittig am unteren Ende des Contents ausgerichtet) und in die beiden Textspalten jeweils ein floatendes div (ohne Inhalt) in halber Bildbreite, um die der jeweilige text dann fließt. Sollte doch machbar sein…
Werde das aber als nächsten Durchstoßpunkt vornehmen.
Aber sonst hört sich dein Text ja ganz schön positiv an, ich glaub so gut kam ein erster Entwurf bei dir noch nie an ;-)
Hast zum Beispiel auch kein Wort darüber verloren, wie komisch das denn aussieht, wenn da eine Spalte einfach mal komplett schwarz ist, das obere Bild total überlappt und das untere Bild halb im Text hängt. Das ist das, was mich noch am meisten beschäftigt.
Die linke Spalte einfach auf die komplette Breite ziehen will ich nicht, denn das ist zu breit und schlecht zu lesen.

antwortenReply to this comment
 
 
Co:

Auf die Gefahr hin, dass du das jetzt vielleicht nicht als Kompliment nimmst, ich meine es auf jeden Fall als solches: Roger wäre stolz auf dich! ;)
Ne, find ich sehr schick, durch den dunklen Hintergrund mit der hellen Schrift lenkt nichts vom Objekt selbst ab. Auch die Aufteilung mit den beiden Spalten finde ich sehr angenehm gelöst.

Warum nicht klar wird, ob ich gerade privat oder öffentlich kommentiere, verstehe ich aber nicht. Wenn ich links reinschreibe ist es öffentlich und wenn ich rechts reinschreibe privat, oder? Also passt doch und is bestens intuitiv.

Eine Sache hätte ich allerdings noch anzumerken: Rein intuitiv hätte ich jetzt vermutet, dass die drei Bilder links zu den nächsten/letzten öffentlichen Artikeln verlinken und die drei Bilder rechts zu den nächsten/letzten privaten. So sieht der private Leser auch, was der Öffentlichkeit vorenthalten bleibt. Außerdem hätte es den Vorteil, dass ein öffentlicher Leser den rechten Teil der Seite gar nicht braucht, denn außer diesen Bildern rechts wird ihm ja eh nichts angezeigt. Damit hast du dann zumindest bei öffentlichen Lesern auch schonmal das Problem weg, dass die Seite zu breit wird.

Wird die “Lücke” im öffentlichen Kommentarfluß eigentlich nur eingebaut, wenn ich den privaten Kommentar auch sehe, oder wird einem öffentlichen Leser auch ganz klar und deprimierend gezeigt, dass er jetzt was verpasst? Ja, dass vielleicht sogar jemand privat auf seinen vorhergehenden öffentlichen Kommentar geantwortet hat?

antwortenReply to this comment
 
 
donvanone:

@Co: Roger wäre stolz auf mich? Waaaaah!
Dummerweise hast du mit deinem Kommentar gleich die Intuitivität wieder kaputt gemacht. Links ist nämlich öffentlich und rechts privat. oder du hast nur diese frauentypische links-rechts-Schwäche ;-)
Wegen deinem Ansatz für die drei Vorschaubilder rechts und links: Es ist nicht geplant, dass es reine private Beiträge gibt. Zumindest das Bild ist immer zu sehen.
Und ja, die Lücken in den Kommentaren sind nur dann da, wenn man auch private Kommentare sieht. Sonst sind die geschlossen. Ein öffentlicher Mensch kann nicht sehen, ob und wie oft privat kommentiert wurde.
Nochmal @Fluffi: Eine weitere Heraudforderung, die ich mir eingebaut habe ist dieser schwarze Rahmen in den Bildern. Den will ich mit nem eigens dafür geschriebenen WordPress-Plugin automatisch reinbauen (Bild ist Hintergrundbild in nem Div und darin ist ein kleineres div mit schwarzem Rahmen). Man muss ja an seinen Projekten wachsen…

antwortenReply to this comment
 
 
Olli_S:

Hallöle!

Das Layout ist schick und passt in der Breite hier sogar (fast) – was hast Du für ne Auflösung?
Werde ich als “Fremnder” den Text einspaltig sehen oder nur die Linke Spalte und rechts große Leere?

antwortenReply to this comment
 
 
donvanone:

@Olli_s: Danke. Zur Einspaltigkeit: Siehe einen Kommentar weiter oben. Ich bin noch unschlüssig. Vermutlich bleibt es rechts aber einfach leer…
Hier auf der Arbeit hab ich 1680*1050. Daheim nicht ganz so viel, da ist nicht mehr ganz so viel Platz am Rand…

antwortenReply to this comment
 
 
Co:

Das mit der Rechtslinksverwechslung war allerdings nur beim Schreiben, hatte es eigentlich schon richtig gemeint, weshalb ich es mit der praktischen Kommentarnachbearbeitungsfunktion vorhin auch schon wieder ausgebessert hatte ;)

antwortenReply to this comment
 
 
Ro(ke):

Gefälliges Layout – zumindest für diejenigen, die den privaten Zugriff bekommen. Von der öffentlichen Seite kann ich mir so irgendwie kein Bild machen – deshalb kommt von mir jetzt die Kritik, die Du eigentlich schon von Fluffi erwartet hattest: mit ner großen schwarzen gähnenden Leere rechts, in der Luft hängenden Bildern kann ich net leben – vor allem, da das Layout ja wirklich mal verdammt breit ist. Überspitzt formuliert: “Entweder Du machst Teile davon öffentlich – dann aber richtig – oder belässt es ganz bei einer Privatparty”. Aber so wie ich Dich kenne wird auch die öffentliche Seite eine Augenweide werden – bin gespannt, wie Du das löst.
Das alles mit relativ wenig Farben auskommt finde ich übrigens so richtig Klasse. Ebenso die Navigationsidee – hier könnte man sogar die Vorausschau und Rückschau auf 5 Bilder erweitern und gleichzeitig die Bilder immer kleiner werden lassen, je weiter sie vom aktuellen Eintrag weg sind.
Richtig super sind auch die sich abwechselnden Kommentare – und als Öffentlicher schiebt sich das ja auch zusammen, so dass mich das dann auch net stört.
Negativ fallen mir dann eigentlich nur noch die Trauerränder um die Bilder auf. Gibt es dazu keine Alternative? Es sind doch keine Todesanzeigen, oder?

Und noch zum Argument von Fluffi – der Verwechslungsgefahr von public und private: Wie wär’s mit einem dezenten Wasserzeichen “public” auf der linken Seite, wenn jemand privat eingeloggt ist? Andererseits sollten doch die Leute ein wenig mitdenken können – und wenn’s Editiermöglichkeiten gibt den Kommentar auch wieder schnell löschen können, falls jemand sich doch verklickt, oder?

Bin gespannt, wie Dein Projekt weiter geht – kann auch gut sein, dass Du mir bei dem einen oder anderen dann auch in meinem Blog mal wieder unter die Arme greifen wirst müssen – ich würde (allerdings aus anderem Grund) eigentlich auch gerne einen privaten Bereich einrichten wollen …..

antwortenReply to this comment
 
 
DonsTag » Zweispaltiger Text mit zu umfließenden Objekt am unteren Ende mittels Javascript und CSS:

[...] meinte, dass ich mir mit dem kleinen Bild in diesem Entwurf keinen Gefallen tun würde. Und da sollte er [...]

 
 
DonsTag » Mein neues Blog:

[...] Puh! Da hab ich mir echt keinen Gefallen getan mit diesem Entwurf. [...]