Website development and UX/UI design for Nyíregyházi Torna Sportegyesület

Nyíregyházi Torna Sportegyesület and the goal of the project

We have been working with Nyíregyházi Torna Sportegyesület (NYTSE) for nearly ten years, during which time the club has grown significantly. Today, it is the largest gymnastics club in the city, with some groups becoming so popular that they operate with waiting lists. As the organization has grown, however, its digital communication needs and the amount of information available on its website have also changed considerably.

The previous WordPress website had become outdated both visually and technically, while maintaining a system that relied on a page builder and numerous plugins was becoming increasingly cumbersome. When planning the new website, our goal was therefore not simply to modernize the existing interface. We reconsidered the entire information architecture, the way content is managed, and the functionality of several key features.

One of our main priorities was to help different types of visitors find relevant information as quickly as possible. A parent of an existing gymnast looking for the latest training schedule, for example, has very different needs from a prospective parent who wants to register their child for a trial session or learn more about the club.

A new information architecture for easier navigation

A key part of the design process was therefore organizing a large amount of information serving different purposes into a clear and accessible structure. Training schedules, news, galleries, FAQs, blog posts, camps, workshops, documents, and information about the club were organized into distinct and easily accessible sections.

Alongside the main content, strategically placed CTA sections guide visitors toward key actions, including registering for a trial session, exploring camps, and joining the club. Sponsors and testimonials were also redesigned to give them a more contemporary presentation consistent with the website’s overall visual system. We also created dedicated forms for trial sessions and camp registrations, allowing prospective participants to submit the required information directly through the website rather than relying on external channels or unstructured emails.

Rethinking the training schedule

One of the most significant UX issues on the previous website was the way training schedules were presented. Schedules for every location appeared on a single page in traditional, spreadsheet-like tables. As a result, parents sometimes had to scroll through several completely irrelevant locations and groups before reaching the information they needed.

In the new system, individual cities and locations have their own dedicated schedule pages. Within each page, separate tabs allow visitors to switch between school-year and summer schedules, keeping the two periods clearly separated while maintaining the same logical structure.

We also replaced the previous tables with a card-based interface. Information is grouped according to its importance and purpose, with details such as the group, location, coaches, contact information, membership fee, and training times presented within a clear visual hierarchy. Icons and typographic emphasis make the content easier to scan, so visitors no longer need to work their way through rows of an outdated table to find the information they need.

From a technical perspective, the schedules are modeled as structured content in Payload CMS, while Next.js generates the relevant pages for each location through dynamic routes. School-year and summer programs, groups, training times, coaches, locations, fees, contact details, and other information are managed as separate data fields. NYTSE staff can therefore update this information through the admin interface without having to edit the pages themselves.

Next.js and Payload CMS for easier content management

Instead of the previous WordPress setup, the new website was built with Next.js and Payload CMS. This architecture was particularly well suited to NYTSE because the website contains a substantial amount of frequently updated content with very different structures and purposes.

Rather than manually maintaining this content across individual page-builder pages, we created dedicated content types for news, blog posts, training schedules, galleries, team members, FAQs, testimonials, and Gymnasts of the Month and Year, among others. This separates content management from frontend presentation: the club manages the underlying information, while the website automatically renders it according to the predefined visual system.

The chosen technology stack not only makes day-to-day editing easier but also provides a more scalable foundation for future development. Creating a new training schedule, news article, or gallery, for example, does not require duplicating an existing page and manually adapting its layout.

A custom gallery instead of a WordPress plugin

We also reconsidered how the photo gallery works. On the previous WordPress website, gallery functionality was provided by a separate plugin, which introduced another external component that required ongoing maintenance and updates and could potentially cause compatibility issues.

In the new system, each album can have its own cover image, set of photographs, publication date, and URL, with the frontend automatically generating the corresponding gallery pages from this structured content. We also display the year and the number of images contained in each album, giving visitors useful context before they open a gallery.

This also addressed another limitation of the previous website: it was not always clear which year an album belonged to, and galleries were not consistently displayed in chronological order. The new structured data model allows albums to be organized predictably and consistently, while the custom gallery itself is visually integrated into the rest of the website.

A Wall of Fame that reflects the club’s values

One entirely new feature is the Wall of Fame, where NYTSE can recognize its Gymnasts of the Month and Gymnasts of the Year. Its purpose goes beyond simply presenting competition results. The club does not recognize children solely for competitive achievements: progress, dedication, and their contribution to the community can also provide an opportunity for a gymnast to be highlighted. The feature therefore helps communicate NYTSE’s values and its community-focused approach.

Gymnasts of the Month and Year are also managed as dedicated content types in Payload. The admin interface allows the club to enter information including the year and month, the gymnast’s name, city, and additional details. Photos can also be uploaded for Gymnasts of the Year, while selected gymnasts can receive additional visual emphasis on the frontend. This means that even a fundamentally people-focused feature is supported by a structured and easily extensible content management system.

FAQs for parents and improved search visibility

The previous website did not include a dedicated FAQ section, despite parents regularly having questions about joining the club, training sessions, required equipment, and other practical matters. We therefore created a dedicated FAQ page where important questions and answers are organized in one place. The six most frequently asked questions are also highlighted on the homepage, with a clear path to the complete FAQ collection.

This improves the user experience while potentially reducing the administrative burden created by recurring enquiries. From an SEO perspective, the answers also expand the website with relevant written content around topics that may align with users’ search intent, helping support the site’s organic search visibility.

Presenting the people behind the club

When designing the About page, we wanted the people behind NYTSE to feel like more than a simple list of names. We therefore created a friendly, easy-to-explore team section where visitors can switch between the club president and coaches and access more detailed information about individual team members.

We followed the same principle across other information-focused areas of the website. On the Contact page, different contact details are grouped logically, while the Documents page presents individual files with descriptions and recognizable icons indicating their document type. In both cases, the aim was to help visitors locate the information they need without having to navigate through an unstructured collection of content.

Information about donating 1% of personal income tax to the club was also given its own detailed page. Instead of presenting visitors with a long block of instructions, we established a clear visual hierarchy and divided the process into easy-to-follow steps. The page also includes a dedicated FAQ alongside the essential information and instructions.

News, blog content, and a system designed to grow

News and blog posts are handled as separate content types. This allows NYTSE to distinguish updates about current events, competitions, and club achievements from longer-form educational or informative articles.

Keeping the two content formats separate is useful from both a content strategy and SEO perspective. News can primarily document the club’s current activities, while the blog can provide evergreen content with the potential to attract organic search traffic over a longer period.

Outcome and impact of the project

Rather than simply redesigning an outdated WordPress website, the NYTSE project involved rethinking the club’s broader digital platform. We adapted the content structure to different user needs, reorganized information that had previously been difficult to navigate, and introduced several features that had not existed on the previous website.

The Next.js frontend and Payload CMS-based content management system allow complex content – from training schedules and galleries to news, FAQs, and the Wall of Fame – to be managed in a structured way. As a result, NYTSE staff can focus primarily on maintaining the content itself, while the website’s predefined, consistent components handle how that content is presented.

The result is a modern, responsive website that reflects NYTSE’s current scale and operations while providing a solid technical foundation for future growth. At the same time, well-structured information, easier-to-navigate training schedules, online registration options, the Wall of Fame, and a more people-focused presentation of the club create a more useful digital experience for parents, gymnasts, and prospective members alike.