Hello everyone,

As promised, I’m sharing today the most significant and challenging update to think about and design, as it involves the navigation within the site. It’s the result of over a month of intense work, with many failed attempts and a lot of testing with volunteer players (thanks to them!).

The previous system was designed not to disorient players from an older version of the French website, which featured a button at the bottom right (to switch between main locations) and a menu on the left of the site to navigate within the location.

The system was far from intuitive and rather tedious. For instance, to move from a room in Hogwarts to the Forge shop in Gringotts, one had to: 1/ click on the icon giving access to the "world" at the bottom right, 2/ click on Diagon Alley, 3/ open the drop-down menu at the top left, 4/ select the desired forum in a very long drop-down menu (up to almost 1 meter for Hogwarts with all locations unlocked), and 5/ click on the shop icon in the center.

This was cumbersome, inconsistent (three different areas to navigate, three different pages to open before finding the right one), and made discoverability very difficult (I’m sure many of you will discover a shop today that you didn’t know existed).

The results were clear: 95% of the navigation on the site was done by spamming the "Unread Messages" page. To give you an idea, almost 1 out of every 5 pages (20%) displayed on the site was a search page (unread messages, my messages, RP messages), compared to 1 out of every 200 for the "World" page (0.5%). Even I preferred finding a topic in my messages to access the corresponding location rather than struggling with navigation.

The objectives pursued: With nearly 300 forums and sub-forums, and a great heterogeneity in their distribution (Hogwarts alone contains two-thirds of them), navigating between the different locations on the site is a real puzzle. The goal is to:

• Allow players to go where they want to easily (with as few clicks and searches as possible).
• Help players understand where they are.
• Make the different locations easily discoverable/explorable.
• Be flexible to allow for future expansions (creating new locations).
• Try to remain as immersive as possible.

The whole system must remain clear in relation to other site pages: not everything is a location. There are also "search" pages (unread messages, my messages, my RPs, favorites...) and various auxiliary pages (owl posts, trunk, address book, Remembrall...).

The new menu in the top-left corner follows these principles:

• All locations and pages are now just one click away (on desktop), no matter where you are on the site.
• Navigation is now identical across all site pages, greatly enhancing predictability and visual/muscle memory (you’ll quickly remember where the different locations are).
• There are only two logical navigation areas: locations are all at the top-left, and special pages are all at the top-right (for now, I’ve kept the bottom bar, which many of you are very accustomed to, but it’s redundant).

I tested many systems:

• On desktop, intermediate category pages (long), a large banner displaying all the locations of one area at once (but the heterogeneity and vastness of Hogwarts made this unreadable), and drop-down menus... This three-column system was the one that solved all the issues.
• On mobile, scrolling menus, menus opening pages and sub-pages... In the end, an "accordion" system that unfolds sub-sections was deemed the most practical for regular use; it’s not perfect, but a phone screen is still small...

To improve navigation further, we’ll likely need to reorganize some forums—a task to undertake with the administrators:

• Revise the titles of locations in Hogwarts to make pages easier to find, as it’s not easy to remember the floors.
• Make the encyclopedia more visible and understandable, turning it into a true source of welcome, help, and information, especially for new players.

Accessibility improvements bring a lot to the table:

• Unlike the previous system (which was not accessible at all), these menus are compatible with mouse-over navigation, click navigation (which "freezes" the menu), touch navigation, keyboard navigation (with the Tab key), and screen readers.
• All contrasts have been adjusted to comply with the WCAG AAA standard; this benefits visually impaired users but also makes the site easier to use in low light, sunlight, or on a poor-quality screen.
• The font size has been slightly increased (from 15px to 16px) to meet recommendations; as someone whose eyesight is declining with age, younger users will understand one day. For those who dislike it, you can still reduce the font size in your browser settings.
  [] Buttons have been spaced and enlarged to be easily selectable on both desktop and mobile devices (e.g., selecting the blue feather at the top-right on mobile previously required pinpoint precision).

All site pages will gradually be redesigned to improve accessibility, contrasts, and simplify the code. This work will span many months, and I doubt it will be completed before the end of next year.

Some final points:

• The top-right menus have also been rewritten for better readability and easier link selection, on both desktop and mobile.
• It’s no longer possible to click directly on your house, the Remembrall, or the frame. Having icons that triggered both a link and a menu caused issues on certain phones or devices with both mouse and touch inputs (e.g., many modern computers); it was impossible to open the menu without triggering the link.
• Color issues have been resolved on the Consilium.
• Money is now displayed in a "purse" link while I work on a better system.
• Unread owls and notifications now appear as a badge with a small number, similar to many websites and apps. I made this choice considering complaints about the previous animations (which were not very visible when disabled). Some love it; others don’t. It’s hard to find something that pleases everyone.
• I remain very dissatisfied with the bottom bar (with shortcuts) for many reasons I won’t detail here. However, given its heavy usage, I’m keeping it for now.

All these updates come with a complete rewrite of the relevant parts of the site. I’m using recent CSS advancements (allowing for much more and simpler code), so using an up-to-date browser (Firefox, Chrome, Edge, Safari) is essential. If your browser hasn’t been updated in over a year and a half/two years, the site won’t display correctly.

Click here to discuss these updates and share your feedback, opinions, or comments.

Good evening, following your feedback, here are a few updates:

• you can now choose in your preferences whether to display the owl counters and unread notifications (shown by default) as well as the shortcut bar at the bottom (hidden by default);
• compatibility with older versions of Safari has been restored by rewriting part of the code with older syntax;
• drafts have been moved back to the bottom bar.

Hello everyone,

After three days of hair-pulling, energy drinks, and suffering, I have:

• rewritten and reorganized a large portion of the site's header code; you shouldn't notice any difference, but overall it's lighter and more readable for future maintenance;
• revamped several graphics (especially the brick and wood ones) to replace them with higher quality images and better align the bricks or planks with the edges, which looks much better; it's subtle, but it makes a big difference to the overall look.

Some small improvements:

• a quick selector to change locations within the same large location across all forums; it lets you move around a floor at Hogwarts or the Diagon Alley area... more quickly; I'd appreciate your feedback on this one;
• fixed a bug that prevented the location menu from opening on hover when clicking on the crest at the top left;
• fixed a bug that caused dropdown menus at the bottom of the page (especially at the Owlery) to not expand upwards, making them inaccessible;
• ability to display your Galleons in your pouch if you're a first-year (it's not very pretty, it's a temporary solution!);
• corrected various links and simplified the process for new users;
• improved several shadow effects;
• added small icons to the login buttons.

I really like the quick selector, as going through the menu every time was getting frustrating. Thanks for this!

I still do wish there was a way to get the owl animations back, but I'm warming up to the other changes, and the new aesthetics are nice.

I was just wondering isn’t your rememberal supposed to alert you every 23 hours for voting points? It is currently only going at the same time every day and it is a really awkward time for me to get too.

Louisa McStately wrote: 11 Jan 2025, 23:58

I was just wondering isn’t your rememberal supposed to alert you every 23 hours for voting points? It is currently only going at the same time every day and it is a really awkward time for me to get too.

No, it's every day at 9 am. You can change your timezone when you edit your profile in preferences. Also, this is actually not a good place to post this (and other questions) but instead in the F.A.Q. forum. The questions thread is a great place and frequently checked. (About the rememberall notifications for voting, someone please correct me if I'm wrong!)

Lyanna Oak wrote: 13 Jan 2025, 21:06

Louisa McStately wrote: 11 Jan 2025, 23:58

I was just wondering isn’t your rememberal supposed to alert you every 23 hours for voting points? It is currently only going at the same time every day and it is a really awkward time for me to get too.

No, it's every day at 9 am. You can change your timezone when you edit your profile in preferences. Also, this is actually not a good place to post this (and other questions) but instead in the F.A.Q. forum. The questions thread is a great place and frequently checked. (About the rememberall notifications for voting, someone please correct me if I'm wrong!)

Oops thanks!