February 25, 2019
Hello everyone!
The first round of improvements to site navigation we have been talking about are now live - you will see a "mega menu" on desktop browsers.
Keep in mind that while some of the nav consolidation discussed below will be found in mobile/tablet resolutions, a full overhaul of those menus will come in a later iteration.
With the mega menu, we have the following goals:
- Usability. This goal was our guiding star for these updates. The previous menu navigation structure became difficult and frustrating to use. It required fairly precise mouse pointer movements to navigate the numerous rows/columns, and we received considerable feedback that it was not easy enough to get where you wanted to go on the site. The mega menu should alleviate the need for precise pointer movement and be generally easier to read/absorb. Goals folding up into usability were simplicity, scalability, and visual appeal.
- Simplicity. The previous nav had multiple layers of nested selections that were overly complex, and our analytics demonstrated that the large majority of users were simply clicking on the "top level" selection anyway. The mega menu exposes those top level choices in an easier to consume manner that should help usability.
- Scalability. The complexity of the main nav menu really started to stand out as we got into 2019 (and beyond) planning for features. With what we saw, there was no reasonable way we could introduce the considerable amount of new functionality that we have targeted for the next several years unless we made some changes. The re-grouping and consolidation of some of the menu items you now see in the mega menu sets us up to be able to add in encounters, interactive maps, DM screen, and all the other additional features in a sensible way.
- Visual appeal. As with anything we do on D&D Beyond, we seek to provide a level of visual polish that makes using DDB a delight. The mega menu updates are no different.
Now I'll give a rundown of the new sections of the menu to hopefully ease everyone's transition:
Sources
The Sources menu contains all official D&D digital content, from the Player's Handbook to Waterdeep: Dungeon of the Mad Mage. Each source is recognizable by cover, and be sure to try using your scroll wheel on the carousel to get to the book you need faster.
As we move forward, you will start to see that all D&D Beyond content and functionality will start to be grouped by these sources. For example, soon you will be able to click on the cover for Waterdeep: Dragon Heist to see not only the book's Table of Contents and links, but also all the listing or game rules information (including encounters once those are implemented) all in one place. This menu will also incorporate other types of products that D&D Beyond releases over time.
Game Rules
The Game Rules menu consolidates all the listings for game mechanics that were formerly in separate Characters, Spells, Magic Items, and Monsters menus. Here you'll see Races, Classes, Feats, Backgrounds, Spells, Magic Items, Equipment, and Monsters selections. This is the menu you use to reference official game mechanics - not the things you create from those mechanics (like your characters or campaigns, that's the Creations menu summarized below).
This menu will allow us to expand into things like Encounters and other potential (emphasize potential since these elements are currently in playtest and not published) mechanics like Sidekicks or Vehicles.
Creations
This menu collects all the things you or other players create from the game rules - like My Characters, My Campaigns, My Homebrew Collection, My Homebrew Creations, and the place to Browser & Create Homebrew content. This is the menu you use to find your stuff - the things you've made - or the stuff others have made.
This menu will also allow us to expand to some exciting new types of creations in the future, but we're not quite ready to talk about all that too much yet.
Tools
This menu will provide an easy place to find all the digital tools we provide now and in the future. Currently, you'll find the Character Builder and Twitch Extension.
The idea is this grouping will allow us to expand as we release the encounter builder, interactive maps, initiative/ combat tracker, DM screen, and more, and hopefully those will all be easy to find in the Tools menu.
Marketplace
This menu will have our Store and Subscriptions areas as it always has, but also the Redeem a Key page and an easier way to access your Order History.
We will also see this menu expand its options over time as we introduce other types of product offerings.
Media
This menu collects all of our original Articles content, as well as an easier way to find our new streamed content such as the (now) weekly Dev Updates, Heroes of the Vale, and Todd Talks. Clicking through to Articles also provides a portal to access all the posts in a particular article series - like the new Encounter of the Week.
Over time, we expect this section to also include other types of multi-media content, such as image galleries, desktop wallpapers, and some other exciting new opportunities we can't talk about yet.
Forums
This menu will continue to take you to our Forums - join in on the discussion, there's a huge, active community there!
Next Steps
While this first iteration should make things much easier on desktop, we will continue improvements for navigation in the near future:
- Mobile/tablet menu overhaul
- Accessibility updates to allow for better screen reader use/keyboard shortcuts
- Work to allow "hover" on desktop but "click" on tablet, even if resolutions are the same
As always, let us know if you have any feedback regarding the main nav changes in our D&D Beyond Feedback forum!
Looks great! The one issue I've found is scrolling using a gesture device in Safari makes the sources go all the way to the start or the end of the list. You can't scroll slowly to the pages in-between.
Thanks for the feedback - we're definitely not optimized for gestures at this point. That will get tightened up with the mobile/tablet pass.
The link to twitch extension on mobile goes to features.dndbeyoond.com/twitch-extension
Amazing update, the navigation is awesome now!
Beyond Help extension is right now broken due to this update. I will make a new version with fixes ASAP (working on it right now).
Got it! Thanks Sillvva!
A suggestion: it would be neat if preference was given to sources to which the user has access (or alternatively, allowing the user to reorder the sources). For me personally, it'd be nice if I didn't have to scroll past a bunch of stuff I don't have in order to get to Princes of the Apocalypse.
But that's a fairly minor quibble with a change that seems overall nice.
Getting 404 errors on all creations links.
Great thank you! And for context, I was using my Magic Mouse via my laptop when the issue popped up.
You may need to clear the history in your browser to pick up the new re-directs.
Did this update remove the sidebar navigation within source books? The Game Sources for Races and Classes still have a side bar, but not say the Player handbook.
Thank you, I will give it a try.
That should be fixed now.
Is it not possible to select a specific class from the drop-down menu? That was always important to me.
Looks marvelous, thank you for the hard work.
I am using iOS and Safari and am unable to access my characters. The link gives me the 404 error. I tried clearing my browser history per suggestion earlier in the thread. Any tips welcome. Thanks.
Hi Garret, I finally got it to work with some hyper fast clicking. The new navigation buttons/links would flash super fast before reverting to the old view even after clearing the browser.
I understand the need to cater to the majority and reduce the complexity of nested menus. But, being able to get to a specific class or spell list in one click was extremely convenient. If you absolutely can't fit that into the megamenus, can I make 2 suggestions:
- Make the 'all spells' page behave like the individual class spell pages; infinite scroll rather than pagination and default to sorting by spell level rather than alphabetical
- Reduce the size of the class overview buttons on https://www.dndbeyond.com/classes so that they all fit on a 1080p screen, so that we can click through twice without having to scroll down as well
We'll take a look at all the feedback from the broader community and make adjustments as needed. The data demonstrated that the vast majority of users never made it to the third tier of selection to choose an individual class, so we cut out that layer at this time.
Of course we would love to have it all in there so everyone can have it all ways, but given the way that the main nav will have to expand in the coming years, we want to err on the side of simplification at this point. We will likely introduce some other ways to alleviate some of these issues, but we also want to see how people feel in a couple of weeks when the "change reaction" phase is over.
Thanks!
Holy smokes, this is awesome! The plans for the Sources section really gets me excited!
Sorry... really, REALLY not a fan of the changes.
Not just dumping on it, I understand why a change was needed, but there are some simple things that would make it way better, IMO as a well paid full stack developer consultant:
The new layout looks great! I only miss the option of going straight to the race/class I'm looking for. Added a couple of clicks to get there. Still, I do like to see the races grouped by sourcebooks.