Web redesign for the most active music community in the UK

Complete responsive layout of forums, live chat and lists of successes for an online community with more than two decades of activity.
Agency / Partner Unlocal Studio
Client Buzzjack
Services Partner creativo
Year/s 2020
Main music community dashboard — three-column layout with central feed, own groups and real-time chat notifications
Main music community dashboard — three-column layout with central feed, own groups and real-time chat notifications
Artist Group View — Responsive UI with Wall / Info / Forum / Chat tabs and integrated membership system for online music communities
Artist Group View — Responsive UI with Wall / Info / Forum / Chat tabs and integrated membership system for online music communities
Administrator management modal — search and role assignment component with online presence indicators for forum platforms
Administrator management modal — search and role assignment component with online presence indicators for forum platforms
Mobile-first responsive design — three iPhone views with news feed, band list, and music chart forum reply thread
Mobile-first responsive design — three iPhone views with news feed, band list, and music chart forum reply thread
Registration screens, user profile and filter system — onboarding flow with social authentication and notification preferences panel for online community
Registration screens, user profile and filter system — onboarding flow with social authentication and notification preferences panel for online community

Complete redesign on Bootstrap with modular SASS and PHP as an integration layer

Redesigning an established online community is more delicate than building from scratch. Buzzjack had loyal users with deeply rooted browsing habits: chart forums, song contests (BJSC), real-time chats, and news blogs. Modernizing the interface without breaking existing flows, doing so across desktop and mobile versions with distinct behaviors, was the central knot of the project.

I designed specific components for the community's real-life use cases: a tab system for navigation between sections, chat with message bubbles, differentiated header and footer menus for mobile, and dark mode from the first deliverable. I handed over structured and documented code so the client could maintain it without external dependencies, as stipulated in the collaboration agreement.

Frontend