Navigation desktop: dropdown menu ontwerpen (figma)

[Nazneen05x]

We hebben nieuwe pagina’s bij gekregen, de opdrachtgever wilde graag dat de pagina’s in een dropdown menu komen. Ik heb inspiratie opgedaan op internet hoe andere dropdown menu's hebben ontworpen en gebouwd. Ik heb drie verschillende ontwerpen gemaakt, ik heb de dropdowns simpel gehouden in de huisstijl van de opdrachtgever.

---

Contrast checker

[Annevd]

Hoi Nazneen, bij deze mijn feedback op je design!

• Ik vind de nav van nummer 3 er clean uit zien. Het past bij de rest van de navigatie en is nog steeds duidelijk een dropdown door het pijltje wat er naast staat.
• Wanneer je de dropdown open hebt staan vind ik nummer 1.1 er het mooist uitzien. Het hoort duidelijk bij elkaar en ziet er netjes en rustig uit doordat de achtergrondkleur doorloopt in de titel van de dropdown.

Nog een paar tips:

• Ik zou de naam van "projects" veranderen naar "projecten" omdat de rest ook in het Nederlands is
• Zorg ervoor dat alle navlinks met een hoofdletter beginnen
• Misschien kun je nog iets meer witruimte toevoegen tussen de sublinks van de dropdown en de font-size iets groter/net zo groot maken als de navlinks

Goed bezig! 👍

[wingsvn]

Hey Nazneen, mooie ontwerpen! Hier mijn feedback: In eerste instantie tussen 1, 2 & 3 vind ik 3 er het cleans uitzien. De layout van de projects knop sluit mooi aan bij de rest van de links binnen het menu. Ook het pijltje naar beneden maakt het duidelijk dat er nog meer te vinden is onder projects. 2 daarentegen is iets opvallender en drukker, maar zorgt daardoor wel weer voor meer onderscheid ten opzichte van de andere links binnen het menu. Waardoor er misschien wel meer nadruk op de projecten wordt gelegd, wat weer goed is.

Als ik vervolgens kijk naar de dropdown, vind ik 4.4, 5.5 en 1.1 het best. Hier heeft het hele dropdown menu dezelfde styling als het het projects link/knop zelf. Dit zorgt ervoor dat het er meer als een geheel uitziet. Bij 5.5 vind ik de gap tussen projects en de dropdown net iets te groot. Mijn eindkeuze gaat dan uiteindelijk naar 4.4 & 1.1