it-swarm.com.de

Wie soll ich Miniaturansichten von Seiten im Querformat in einer Reihe von Miniaturansichten im Hochformat darstellen?

Ich arbeite an einer kleinen Website, auf der traditionell kleine (300 x 388) Pixel-Miniaturansichten ihrer Veranstaltungsplakate angezeigt werden, die mit dem vollständigen, mit Tags versehenen PDF verknüpft sind.

Die meisten ihrer Poster sind einfache Briefseiten im Hochformat. Ich habe gerade eine dreifach gefaltete Broschüre erhalten, die der Kunde auf die übliche Weise zur Website hinzufügen möchte.

Dies erinnerte mich an eine Frage, die ich vor einigen Monaten unter UX gesehen hatte: Ist gedrehter Text im oder gegen den Uhrzeigersinn leichter zu lesen? .

Meine Frage ist verwandt. Angesichts der Tatsache, dass die dreifach gefaltete Broschüre aus Gründen der Konsistenz das zweite Vorschaubild in meinen folgenden Beispielen ist, sollte ich:

(A) Drehen Sie das Bild auf die Seite und zeigen Sie eine Miniaturansicht von 300 x 388 an

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups

(B) Präsentieren Sie das Miniaturbild der Broschüre als 300px breites Landschaftsbild in seiner lesbaren Ausrichtung:

mockup

bmml Quelle herunterladen

In beiden Fällen soll der Text auf dem Miniaturbild nicht lesbar sein. Ich bin nur neugierig, welcher Fall für den Benutzer angenehmer wäre. Ich neige mich zu (B).

5
msanford

Ich würde mit B. gehen.

Wenn Porträtbilder in der klaren Mehrheit sind, müssen diese so klar wie möglich angezeigt werden.

Das Drehen des Bildes, um es auf der Seite anzuzeigen, ist keine gute Erfahrung. Daher ist es vorzuziehen, es in der richtigen Ausrichtung anzuzeigen. Wenn der Benutzer auf die Vorschau klicken und das Bild in voller Größe anzeigen kann, ohne auf die vollständigen Details einzugehen, tritt kein wirklicher Funktionsverlust auf.

10
ChrisF

Wir lösen das identische Problem in unserem Produkt mit Option C (Sie können aktuelle - wenn auch alte - Screenshots unserer Lösung sehen hier und hier ):

mockup

bmml source herunterladen - Wireframes erstellt mit Balsamiq Mockups

Wir machen die Miniaturansichten sehr klein (70 Pixel in der größten Dimension) und weisen dann der Miniaturansicht in der Benutzeroberfläche (in der die Miniaturansicht zentriert ist) ein Quadrat von 70 Pixel zu. Wir haben in der Praxis festgestellt, dass viele Benutzer die Dokumente, nach denen sie suchen, anhand ihrer Ausrichtung und Form ebenso wie anhand ihres Inhalts identifizieren (wenn nicht sogar mehr). Ihre Option (a) unterbricht das Gefühl des Benutzers für die Ausrichtung des Dokuments (ich suche nach einem Querformatdokument), und Ihre Option (b) impliziert einen falschen Maßstab (das Querformatdokument scheint ein wesentlich kleineres Papierformat als das Hochformatdokument zu haben So etwas wie ein A5-Dokument im Vergleich zu einem A4-Dokument in ISO 216 Papierformate).

Ich ermutige Sie auch, mit viel kleineren Thumbnails zu experimentieren. Selbst bei Office-Dokumenten, bei denen es sich meistens nur um Text handelt, gibt es keinen Unterschied zwischen 96-Pixel-Quadrat-Miniaturansichten und 70-Pixel-Quadrat-Miniaturansichten, wenn Sie weniger als 128 Pixel im Quadrat haben (auf unseren normalen Computern).

5
Kit Grose

Option c) um Stabilität und einen guten Rhythmus zu erreichen: Erstellen Sie "Thumbnail" -Versionen Ihrer Bilder auf eine bestimmte Größe (siehe Beispiel unten).

Sie müssten diese zusätzlichen Bilder (entweder per Skript oder manuell) erstellen, aber Ihr Raster ist regelmäßig.

enter image description here

2
Pedro