Overleg TheaterEncyclopedie:Vormgeving TheaterEncyclopedie (2017)

Uit TheaterEncyclopedie
Ga naar: navigatie, zoeken

Vergeet niet je bericht te onderteken met vier "tilden" (tildes?): ~~~~. Je bericht wordt dan automatisch met jouw gebruikersnaam ondertekend (inclusief tijd en datum - timestamp), zodat duidelijk is dat jij de afzender bent!

Meer hulp voor het gebruik van overlegpagina's vind je hier (alleen in het Engels).

Header

  • Logo TE: wordt een ander logo (NB. moet worden aangepast).
  • Diacarrousel: kleiner, bescheidener, en alléén op de homepage, niet op andere pagina's; misschien andere foto's zoeken hiervoor.

bron: Eisen en wensen ontwerp. HvK, TvdB, FB 3-10-2017

Zoekveld

  • niet in de foto, en veel prominenter aanwezig dan nu.
  • Bij het naar beneden scrollen moet het zoekveld op dezelfde plek blijven, dus niet verspringen naar de balk rechtsboven zoals dat nu gebeurt.
  • N.B. het Zoeken moet NIET hoofdlettergevoelig zijn.

bron: Eisen en wensen ontwerp. HvK, TvdB, FB 3-10-2017

Hoofdlettergevoeligheid; betreft het hier wellicht alleen de hoofdlettergevoeligheid van de zoeksuggesties (niet de resultaten)? Zoeken of bijvoorbeeld "wim sonneveld" geeft namelijk ook de desbetreffende pagina met hoofdletters "Wim Sonneveld". De pagina wordt echter niet getoond in de dropdown met suggesties. Bmulckhu (overleg) 16 nov 2017 17:45 (CET)
Ook die zoeksuggesties werden in het recente verleden niet gegeven. Nu wel - dit heeft wellicht te maken met de update van de software? In ieder geval lijkt het probleem opgelost. Tuja van den Berg (overleg) 4 dec 2017 08:55 (CET)

Navigatiebalk

  • De “Balk” onder de diacarrousel met de links naar Home|Personen|Voorstellingen|Producenten|Theaters|Extra’s: kan weg.
  • (noot redactie: de verwijzing naar deze categorieen moet wel elders te vinden zijn.)

bron: Eisen en wensen ontwerp. HvK, TvdB, FB 3-10-2017

Tekst voorpagina

De Tekst op de homepage kan korter. Ongeveer zo: (noot voor de redactie: defintieve tekst moet nog gemaakt):

“De Theaterencyclopedie is het levende platform met informatie over het heden en verleden van theater in Nederland. Iedereen kan aan deze Theaterencyclopedie meeschrijven: theaterliefhebbers én theaterprofessionals maken samen de Theaterencyclopedie actueel en compleet. Dagelijks wordt de Theaterencyclopedie aangevuld met nieuwe gegevens en nieuwe voorstellingen. Ook heeft de Theaterencyclopedie meegewerkt aan speciale projecten.”

bron: Eisen en wensen ontwerp. HvK, TvdB, FB 3-10-2017

Galeries

  • Fotogalerij: Die van de Personen en Voorstellingen behouden. Die van de Theaters en Extra’s verwijderen.
  • N.B. Bij klikken op een foto in de fotogalerij moet je op de pagina van de persoon of voorstelling komen, niet op de foto.

bron: Eisen en wensen ontwerp. HvK, TvdB, FB 3-10-2017

Social Media

  • Social Media logo’s die onder de fotogalerij staan: dat zijn er te veel. Aanpassen – alleen Facebook en Twitter behouden.
  • De logo’s kunnen ook op een andere plek staan.

bron: Eisen en wensen ontwerp. HvK, TvdB, FB 3-10-2017

CTA "Schrijf mee!

  • De oproep “Schrijf mee!” (verwijzend naar de pagina “Hoe kan ik meeschrijven aan de Theaterencyclopedie?”moet niet hier onderaan, maar juist prominetn op de homepage te zien zijn.
  • Daarnaast zou het mooi zijn dat deze tekst op alle andere pagina’s te zien is, behalve als je bent aangemeld. (dan schrijf je namelijk al mee). Is dit mogelijk?
  • noot redactie: deze pagina “Hoe kan ik meeschrijven aan de Theaterencyclopedie?”aanpassen, alle schrijf-mee-pagina’s daar onderbrengen

bron: Eisen en wensen ontwerp. HvK, TvdB, FB 3-10-2017

Partner-logo's

  • Fondsen en partners: Kan weg, zowel van homepage als van andere pagina’s.
  • noot redactie: Op de pagina Zijn / Niet_Zijn worden de fondsen in de tekst genoemd, met een logo, dat blijft zo. )
  • Sidebar rechts: Alles wat daar staat kan weg.

bron: Eisen en wensen ontwerp. HvK, TvdB, FB 3-10-2017

Footer

  • Alleen het onderste gedeelte behouden, wat nu onder de streep staat, met toevoeging van FAQ (verwijzen naar pagina Meest gestelde vragen):

“Theaterencyclopedie is een uitgave van de Bijzondere Collecties (UvA) en de Stichting TiN.” (NB: TiN en niet TIN) FAQ Privacybeleid Over Theaterencyclopedie Algemeen voorbehoud”

  • De drie kolommen met Schrijf mee, Extra’s en Achter de schermen kunnen dus weg.
  • N.B. noot voor de redactie: op de pagina “Over Theaterencyclopedie” moet ook te vinden zijn: verantwoording van de inhoud van de Theaterencylcopedie, en Colofon

bron: Eisen en wensen ontwerp. HvK, TvdB, FB 3-10-2017

Typografie

De UvA-huisstijl maakt gebruik van verschillende lettertypen. De ‘Meta Pro’ is de identiteitsbepalende letter van UvA-web. Zowel de Sans Serif (Book en Bold) als de Serif variant (Bold) worden gebruikt. Meta Pro Book en Meta Pro Bold worden gebruikt voor het overgrote deel van alle tekst in de website, zoals broodteksten, tussenkoppen en links. De Serif Pro Bold variant wordt enkel toegepast voor paginatitels en voor koppen in banner-, quote- en margeblokken.

bron: https://extranet.uva.nl/content/a-z/huisstijl/bouwstenen/typografie/typografie.html

Inmiddels heb ik de betreffende fonts (MetaWeb-book, MetaWeb-bold en MetaSerifWeb-bold) vanaf de website uva.nl 'gescrapet' (via een trucje gedownload). De font-bibliotheken zijn op de test-server geïnstalleerd en via de CSS van de Test-TE beschikbaar gesteld. De verschillende lettertypen zijn dus nu d.m.v. de gangbare styling-elementen (font-family: 'MetaWeb' etc.) bruikbaar op de Test-TE. Bmulckhu (overleg) 24 nov 2017 10:59 (CET)

Kleurgebruik

De kleurstelling moet aansluiten bij de kleurstelling voor de faculteit van Geesteswetenschappen. Het kleurenpalet van de UvA-huisstijl bestaat uit verschillende delen: de corporate kleuren, de faculteitskleuren en de kleuren voor de campagnes van de bacheloropleidingen en die van de masteropleidingen. Voor ieder medium is een technische variant van de kleur gedefinieerd. Drukwerk: Pantone® (PMS®). Er is een U en C code voor gestreken en ongestreken papier. 4 kleuren drukwerk: CMYK (Cyaan, Magenta, Yellow, Black) Beeldscherm: RGB (Red, Green, Blue), Internet (HTML): Hexadecimale (HEX) Lees meer over het gebruik van kleur in de pdf 'Basiselement kleur'.

Kleurgebruik Geesteswetenschappen

  • UVA FGW BLAUW
  • PMS® 661
  • 100C / 69M / 0Y / 9K
  • R 0 / G 78 / B 146
  • #004E92

bron: https://extranet.uva.nl/content/a-z/huisstijl/bouwstenen/kleur/kleur.html

Schetsen Vormgeving op mobiel en desktop

Schetsen gemaakt november 2017 voor skin op mobiel en desktop (FB;TvdB) Graag horen wij in het eerstvolgende overleg dd. 7 december of we zo op de goede weg zijn. Vervolgens kunnen ook andere pagina's uitgewerkt worden. Tuja van den Berg (overleg) 30 nov 2017 09:26 (CET)

MOBIEL

  • 1. Schets voor de niet aangemelde bezoeker op specifieke pagina van een persoon
  • 2. Schets voor de niet aangemelde bezoeker op de homepage
  • 3. Schets voor de niet aangemelde bezoeker op specifieke pagina van een voorstelling


DESKTOP

  • 4. Schets voor de niet aangemelde bezoeker op de homepage
  • 5. Schets voor de aangemelde bezoeker (=bewerker) op specifieke pagina van een persoon


1. Niet aangemelde bezoeker op pagina persoon - mobiel

Vormgeving-TE-november2017-1.jpg

Een bezoeker van de TE landt op een specifieke pagina, bijvoorbeeld van een persoon (Cristina Deutekom). Links wat zichtbaar is op mobiel, rechts wat zichtbaar wordt als je naar beneden scrollt.

HEADER: Logo Theaterencyclopedie (bij doorklikken kom je op Home), Tekst "Theaterencyclopedie", Menu (Hamburger).

  • Menu: navigatie is eenvoudiger (in plaats van de huidige navigatie Personen, Voorstellingen, Producenten, Theaters, Extra's): 4 pagina's:
    • Schrijf mee! (verwijst naar pagina "Hoe kan ik meeschrijven aan de Theaterencyclopedie?")
    • Etalage (= keuze uit 4 nieuwe/bewerkte pagina's: Persoon, Theater, Voorstelling, Prijs)
    • Theatercanon (verwijst naar pagina "Canon van het Theater in Nederland")
    • Over de Theaterencyclopedie (verwijst naar pagina "Over Theaterencyclopedie")

ZOEKVELD: Duidelijk zoekveld met daarin het woord "Zoeken" en bv. symbool van loep. Dit zoekveld blijft op alle pagina's direct onder de header zichtbaar (of maakt deel uit van die header).

BODY:

  • Naam Persoon - hier "Cristina Deudekom"
  • Beroep - in dit geval "Zangeres"
  • Kerngegevens uit de infobox
  • Kopje "Biografie" waaronder het begin van de tekst (uitvouwbaar)

Bij naar beneden scrollen verschijnen alle kopjes, met uitvouwbare tekst, en daaronder de categorieën, en tenslotte de footer:

  • Categorieën: Persoon Operazanger Sopraan

FOOTER

  • Privacybeleid - Voorbehoud - Disclaimer

SOCIALS

  • De knoppen voor de Socials (Facebook, Twitter, Instagram...?) moeten altijd zonder scrollen ergens duidelijk zichtbaar zijn.

2. Niet aangemelde bezoeker op homepage - mobiel

Vormgeving-TE-november2017-2.jpg

De bezoeker komt op de homepagina door te klikken op het Logo. Links wat dan zichtbaar is op mobiel, rechts wat zichtbaar wordt als je naar beneden scrollt.

HEADER: als sub 1; met ook het Zoekveld als sub 1.

BODY:

  • Tekst "Welkom op de Theaterencyclopedie...."
  • Daaronder het begin van de Etalage 1(een persoon), daaronder het begin van Etalage 2 (een theater). Daarbij de foto beeldvullend. Als je naar beneden doorscrollt komen alle 4 pagina's van de etalage in beeld, met daaronder de footer.

FOOTER

  • Privacybeleid - Voorbehoud - Disclaimer

SOCIALS

  • De knoppen voor de Socials (Facebook, Twitter, Instagram...?) moeten zonder scrollen altijd duidelijk zichtbaar zijn.

3. Niet aangemelde bezoeker op pagina voorstelling - mobiel

Vormgeving-TE-november2017-3.jpg

Een bezoeker komt terecht op de pagina van een voorstelling (première), bijvoorbeeld Hamlet van het Zuidelijk Toneel. Links wat dan zichtbaar is op mobiel, rechts wat zichtbaar wordt als je naar beneden scrollt.

HEADER: als sub 1; met ook het Zoekveld als sub 1.

BODY:

  • Tekst, namelijk de titel voorstelling, gezelschap en premieredatum: "Hamlet - Het Zuidelijk Toneel - 1993-09-04"; N.B. Kan de presentatie mooier? bijvoorbeeld onder elkaar en de datum voluit:
    • Hamlet
    • Zuidelijk Toneel
    • 4 september 1993

Daaronder het affiche (beeldvullend) of een mooi ander plaatje als er geen affiche beschikbaar is, daaronder de gegevens uit de infobox, daaronder kopje "Informatie" met het begin van de tekst (uitvouwbaar).

Bij naar beneden scrollen komen alle kopjes in beeld, met uitvouwbare tekst, en tenslotte de categorieen en daaronder de footer:

  • Categorieën - N.B. Dit zijn er vaak heel veel bij voorstellingen: zoals in dit geval: "Categorieën: Productie Toneel Repertoiretoneel Producties Het Zuidelijk Toneel Producties Antwerpen Culturele Hoofdstad 1993 Premieres Stadsschouwburg, Eindhoven Auteur William Shakespeare Vertaling Bert Voeten Bewerking Klaas Tindemans Bewerking Ivo van Hove Regie Ivo van Hove Dramaturgie Klaas Tindemans Decor Jan Versweyveld Kostuums Jan Versweyveld Kostuums Tessa Lute Productie Gert Meijer Grime, kapwerk Willem Rutgers Fotografie Keoon Licht Jan Versweyveld Uitvoerende Bart Slegers Uitvoerende Willem Nijholt Uitvoerende Adrian Brine Uitvoerende Viviane de Muynck Uitvoerende Henk van Ulsen Uitvoerende Erik de Visser Uitvoerende Loes Wouterson Uitvoerende Peter van den Eede Uitvoerende Rafaël Troch Uitvoerende René Eljon Uitvoerende Fons Merkies Uitvoerende Laus Steenbeeke Uitvoerende Pol Pauwels Uitvoerende Frank Focketyn Uitvoerende Dirk Tuypens Uitvoerende Steven van Watermeulen Uitvoerende Michael Pas Uitvoerende Antonie Kamerling Uitvoerende Fred Vaassen".

FOOTER

  • Privacybeleid - Voorbehoud - Disclaimer

SOCIALS

  • De knoppen voor de Socials (Facebook, Twitter, Instagram...?) moeten zonder scrollen altijd duidelijk zichtbaar zijn.

4. Niet aangemelde bezoeker op homepage - desktop

Vormgeving-TE-november2017-4.jpg

De homepage zoals die eruit ziet voor een bezoeker, die niet is aangemeld.

HEADER: V.l.n.r.

  • Logo
  • Tekst "Theaterencyclopedie"
  • Menuknoppen 1 en 2
    • Menu 1 : Navigatie. Voorstel is om de navigatie te "verbergen" onder een knop. (navigatie: Schrijf mee!, Etalage, Theatercanon, Over de Theaterencyclopedie)
    • Menu 2 De standaardbewerkingsknoppen die je ziet ook als je niet bent aangemeld, "verbergen" onder een knop.

Zoals: "Pagina Overleg Lezen Formulier bekijken Geschiedenis".

N.B. Het is ons (FB, TvdB) niet duidelijk in hoeverre de koppelingen die standaard verschijnen verborgen kunnen worden, of dat er een keuze uit gemaakt kan worden. Dit geldt ook voor de volgende standaard knoppen: "Koppelingen naar deze pagina Verwante wijzigingen Bestand uploaden Speciale pagina's Printervriendelijke versie Permanente koppeling Paginagegevens Eigenschappen bekijken".

BODY

  • Alle vier items van de Etalage, foto met kopje.

FOOTER

  • De uitgebreide footer zoals nu ook te zien:

Theaterencyclopedie is een uitgave van de Bijzondere Collecties (UvA) in samenwerking met de stichting TIN.

Privacybeleid Over TheaterEncyclopedie Voorbehoud

SOCIALS: Ergens de Social media knoppen steeds goed in beeld.

5. Aangemelde bewerker op pagina persoon - desktop

Vormgeving-TE-november2017-5.jpg

De pagina van een bezoeker die is aangemeld om een pagina te bewerken.

HEADER: als sub 4. Wel verschijnt hier de naam van de persoon die is aangemeld, plus de tekst "Afmelden".

BODY:

  • Naam persoon, daaronder de foto uit de infobox, rechts daarvan de gegevens uit de "infobox"; Onder de foto het fotobijschrift. Daaronder kopjes Biografie, Theater etc. met de volledige tekst. Tekst niet uitvouwbaar. N.B. de Kopjes verschijnen in de linker kolom als er meer dan 3 zijn, zoals nu het geval is.
  • Linker kolom: Alle bewerkingsknoppen (Bewerken, Geschiedenis, Bestand uploaden, Overleg, Volgen etc.): in de linker kolom.

FOOTER

  • De uitgebreide footer:

"Theaterencyclopedie is een uitgave van de Bijzondere Collecties (UvA) in samenwerking met de stichting TIN.

Pricacybeleid Voorbehoud Disclaimer"

SOCIALS: Ergens de Social media knoppen steeds goed in beeld.

Vragen en opmerkingen n.a.v. de schetsen voor de vormgeving

  • Moet bewerken op mobiel ontmoedigd worden? Dus geen "potloodje" naast de kopjes, en geen tekst "Registreren/Aanmelden"? NB bij Wikipedia is het potloodje waarmee je kunt aanmelden ook op mobiel zichtbaar.
  • Voor de "Etalage" is structureel minimale redactie nodig. Te denken valt om in de etalage een Persoon, een Voorstelling, een Theater en een Prijs aandacht te geven. Moet wel enigzins actueel zijn.
  • Als er geen foto beschikbaar is op een pagina van een persoon, theater, voorstelling of gezelschap, zou daar een nieuwe (kleurrijke) afbeelding voor moeten worden ontworpen. In plaats van het schematische plaatje (bij een persoon), de camera (bij gezelschappen en theaters) nu, en in plaats van de tekst "Geen affiche beschikbaar" zoals bij de voorstellingen nu.
  • De pagina's van het navigatie menu: Schrijf mee!, Etalage, Theatercanon, Over de Theaterencyclopedie hebben redactie nodig. Deels herschrijven, en aantrekkelijker maken met afbeeldingen.
  • We volgen de UVA vormgeving - maar is er nog een kleine vormgevings slag nodig speciaal voor de TE voor de mobiele en desktop versie? Denk aan het Logo, lettertype, de kleuren.