Helping Clients Increase Developer Productivity
Client
Coder
My Role
Sole UX Designer
Duration
2 Weeks
Project Context
Coder offers cloud-based development workspaces to large-scale enterprise clients who want the flexibility of self-hosting.
These clients also need better visibility into how developers are using their pre-configured templates.
My role was to design dashboard enhancements that help admins easily track and understand template usage across their teams.
These clients also need better visibility into how developers are using their pre-configured templates.
My role was to design dashboard enhancements that help admins easily track and understand template usage across their teams.
The Problem
Coder clients lack tools to analyze or optimize their templates to improve developer productivity. This not only slows teams down, but can be expensive due to wasted developer time and inefficient allocation of server resources.
The Solution
A redesigned dashboard featuring key metrics that enable clients to easily assess how templates are being utilized and optimize their designs to boost developer productivity.
Enhancement Impact
Enabling admins to optimize templates can make a difference for the company. By improving developer productivity, teams can deliver products faster and more efficiently. And by allocating resources to templates that are actually being used, and deleting ones that aren't, companies can save money on server costs as well.
Ship
Faster
Faster
Clients can ship faster by not
wasting developers' time
on debugging templates.
wasting developers' time
on debugging templates.
Reduce
Cost
Cost
Clients can save money by not
over-provisioning resources to
templates that are not in use
over-provisioning resources to
templates that are not in use
Developer
Satisfaction
Satisfaction
Clients can enhance the developer
experience by making sure templates
perform efficiently.
experience by making sure templates
perform efficiently.
Understanding the User
To help clients enhance developer productivity and reduce server costs, I researched how admins are currently using the dashboard to better understand their tasks and goals.
Defining The Workflow for Admins and Developers
After gaining a clearer understanding of the admin's role, I created a flowchart to map out the actions for admins and developers, showing how their roles differ.
Understanding How Developers Really Use Templates
In order for admins to optimize for developer productivity, they required metrics on how templates are being used. To define these metrics, I interviewed developers to explore how they really use templates and what their pain points were.
Understanding Template Usage
- What motivates you to choose one template over another?
- How often do you create workspaces from templates, and how does that fit into your workflow?
Identifying Pain Points
- Are there situations where you need to customize or modify a template to make it usable?
- Do you feel the templates meet your needs for the types of projects you work on? If not, what’s missing?
From interviewing developers, I found these data points come up time and time again.
What Developers Said
Some templates have slow load times which makes it unproductive to use.
2 Developers
Talking about pain points
Sometimes I run into errors when setting up a workspace and I have no idea how to fix it.
2 Developers
Talking about pain points
I typically just use the same template that my team uses, it makes it easy for us to collaborate.
3 Developers
Talking about usage
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Profile name
CEO / Creative IT
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Profile name
CEO / Creative IT
Developers Typically Use The Same Templates as Their Team
From my interviews with developers, I learned they often use the same templates as their teammates—typically the most popular ones, valued for their reliability and relevant dependencies.
However, popular templates come with challenges, such as slow load times due to limited resources or configuration issues. Developers also struggle to debug errors during workspace launches, and admins are often unaware of these problems until developers report them.
These insights highlight the importance of improving frequently used templates, as they have the greatest impact on productivity.
However, popular templates come with challenges, such as slow load times due to limited resources or configuration issues. Developers also struggle to debug errors during workspace launches, and admins are often unaware of these problems until developers report them.
These insights highlight the importance of improving frequently used templates, as they have the greatest impact on productivity.
Defining Metrics to Help Admins Prioritize Templates for Improvement
✅ Adoption Rate
Measures the percentage of users who have created workspaces from templates.
Helps admins identify which templates are being used at all. It provides a high-level view of initial popularity and appeal.
Helps admins identify which templates are being used at all. It provides a high-level view of initial popularity and appeal.
📊 Usage Frequency
Tracks how often users create new workspaces based on the same template.
Helps admins identify templates that are consistently useful and effective versus those that may be adopted initially but not reused often.
Helps admins identify templates that are consistently useful and effective versus those that may be adopted initially but not reused often.
📈 Growth Rate
Measures the percentage increase in workspace creation for a template over time.
Helps admins identify templates that are gaining traction and becoming more popular, indicating trends either due to a new project or evolving developer needs.
Helps admins identify templates that are gaining traction and becoming more popular, indicating trends either due to a new project or evolving developer needs.
👑 Top Templates
Combines metrics like adoption rate, usage frequency, and growth rate into a single weighted score.
Helps admins quickly identify the most impactful templates, allowing them to prioritize improvements and resources effectively.
Helps admins quickly identify the most impactful templates, allowing them to prioritize improvements and resources effectively.
#️⃣ Total Templates/Total Workspaces Created
This provides admins with a high-level view of the template-to-workspace ratio. An unusually high number of templates compared to workspaces may indicate unused templates that can be removed.
Below is a sample data table showing how these metrics can be applied to evaluate template performance.
Template Name
Adoption Rate (%)
Usage Frequency (Avg Per Week)
Growth Rate (%)
Top Template Score
AWS EC2 (Linux)
85
20
12
44.4
Azure VM (Linux)
60
15
8
31.6
AWS EC2 (Devcontainer)
40
5
4
20.8
AWS EC2 (Windows)
30
3
2
13.6
Wireframing Features to Help Address Pain Points
Using insights from user research, I created a data table that lists the most popular templates for a given time period. Key metrics are shown in columns to the right, and users can click any row to view more details.
Feedback from stakeholders
I presented my initial design ideas to stakeholders to gather their feedback. They appreciated the ability to view the most popular templates and access detailed insights into their usage patterns and performance. However, after reviewing the wireframes, they shared additional requirements:
I presented my initial design ideas to stakeholders to gather their feedback. They appreciated the ability to view the most popular templates and access detailed insights into their usage patterns and performance. However, after reviewing the wireframes, they shared additional requirements:
- Quick Performance Snapshots
Stakeholders wanted to quickly identify if popular templates required debugging or performance tuning, without needing to click into them. They were only concerned about popular templates with performance issues, not those already performing well. - Tracking Emerging Templates
Stakeholders wanted to identify templates gaining traction in new projects, as these are key to expediting onboarding. They requested something visual to help gauge usage trends effectively. - Monitoring High-Adoption Templates
Stakeholders also wanted to monitor templates with high adoption rates and be able to see their growth. This would help them identify templates that are consistently used and worth optimizing.
Iterating and Final Dashboard Components
Popular Templates
In this iteration, only popular templates requiring attention are displayed. Admins can quickly determine if a template needs debugging, reconfiguration, or additional resources from the provided snapshot.
Usage Frequency Chart
Admins can now identify emerging templates during new projects. The chart highlights trends, making it easy to see what’s rising or falling in usage. Clicking a data point reveals the template name, with an option to view more details by selecting it.
Top Template Adoption
Admins can easily identify the top template at a glance. A supporting table lists other top templates, making it easy to compare growth rates. Templates with high adoption but low growth may require further investigation.
Final Template Dashboard
Below is a full view of the dashboard with the new metric components integrated.
Learnings
Simplifying Decision-Making by Visualizing Data
Visualizing data (e.g., trends, adoption rates) makes it easier for admins to spot issues and take action, such as debugging or reallocating resources. Charts and snapshot views save time compared to navigating through detailed tables. Keeping the design simple and clear makes it easier for users to get things done quickly and feel confident in their decisions.
Visualizing data (e.g., trends, adoption rates) makes it easier for admins to spot issues and take action, such as debugging or reallocating resources. Charts and snapshot views save time compared to navigating through detailed tables. Keeping the design simple and clear makes it easier for users to get things done quickly and feel confident in their decisions.