Skip to content

Developer Communities Platform Design

UI Design

Overview

DevRel City is insights and insider access to curated resources for building thriving developer communities.

Our aim was to create a platform for developers where they could easily build connections, have access to conferences, meetups, and podcasts gathered in one place.


Tasks

  • Establish a strong brand identity that resonates with the target audience
  • Design a multistep sign-up flow with the ability to purchase access to the platform
  • Create a dashboard with ability to customize the view that displays all upcoming events, community members, podcasts
  • Design pages for all entities such as members, conferences, podcasts, and meetups, consider necessary filters, searching, and sorting features
  • Prepare all pages for mobile devices using best practices of responsiveness and adaptiveness
  • Create a marketing website design representing the core features, pricing, and benefits of usage
  • Build a design system that covers the application and marketing website for consistent and ongoing product growth

Tech-stack

Figma LogoFigma
Illustrator LogoIllustrator

Solutions

Branding

Developing the brand identity was the first step in our design process. With a standout logo and brand elements that capture the core idea of the platform, we shaped the basis for all the next stages.

DevRel City logo and brand assets

Sign up flow

We created a multi-step sign-up form with the ability to choose the preferred technologies and based on that purchase the platform access.

User interfaces displaying the sign up process

Platform

We have designed a dashboard and dedicated pages for all the podcasts, conferences, community members, and meetups. These allow users to stay updated on events that they are interested in and build connections with community members.

DevRel dashboard featuring sections for Community Members, Podcasts, a Calendar, Conferences, and Meetups

Community Members section showcasing profiles of various community members with details

Conferences section listing both in-person and online conferences related to web development

Podcasts and Meetups sections featuring a list of podcast episodes with details and upcoming meetups

Marketing site

We built a website showcasing its key features, pricing, and benefits of usage, aligning with the previously developed platform’s branding elements.

Homepage of DevRel City, highlighting its main features and sections

Pricing and About Us pages of the DevRel City platform

Design system

In order to provide a unified and consistent look across platforms, we
built a design system that includes foundations, different component states, custom illustrations.

Various UI components and design elements for the DevRel City platform

Responsiveness & adaptiveness

As a must, we also took care about mobile and other devices' usage to improve user experience and accessibility.

Mobile screens showing the account creation process

Laptop screen showing the DevRel City dashboard

Tablet and phone screens showing the DevRel City dashboard

Mobile screens highlighting Pricing, Overview, and About Us sections

Outcome

We have designed a platform for developers where they can easily build connections, have access to conferences, meetups, and podcasts gathered in one place. Covering the full path from brand development to the platform and its marketing website design we thoroughly provided a proper hand-off and development support.

Let's see how This Dot can help you

Are you looking for a development consulting firm that can provide staff augmentation, architectural guidance, and consulting to your company? Look no further than This Dot Labs. Our team of experienced developers and managers can help you implement and teach modern web best practices, and deliver your projects on time and within budget. Contact us today to learn more about our services and how we can help you achieve your development goals.

You might also like

Portfolio

Our clients are building for the future. Explore This Dot Labs' portfolio, and see how we have helped them achieve their diverse technical goals.