Template Editors

Problem

Buildout's three editors (documents, email, and website plugin) suffered from inconsistency and outdated design, leading to several issues:

1. Inconsistent User Experience: Each editor, designed at different times by different designers, had unique interfaces and workflows.

2. Steep Learning Curve: The differences between editors increased the cognitive load on users, making the system difficult to learn and use efficiently.

3. Outdated Features: Lack of modern features made the editors less competitive in the market.

4. User Churn: These issues were causing users to leave Buildout for competitor products.

Solution

Rebuild and unify the editors with a consistent look, feel, and functionality, while introducing new features to enhance usability and competitiveness.

Reasoning behind this approach:

1. Unified Design: A consistent interface across all editors reduces cognitive load, making the system easier to learn and use.

2. Modernization: Updating the editors with new features addresses the competitive disadvantage and meets evolving user expectations.

3. Retention Strategy: By addressing the core issues causing user churn, we aim to improve user satisfaction and retention.

Process

01. RESEARCH

1. Feedback Analysis: Direct user feedback provides invaluable insights into pain points and desired features. Design Impact: This informs prioritization of new features and improvements.

2. Bug Identification: Addressing existing bugs is crucial for improving user experience and trust in the product. Design Impact: This helps in creating a more stable and reliable system.

3. FullStory Analysis: Observing actual user behavior reveals issues and usage patterns that users might not articulate in feedback. Design Impact: This data informs design decisions by highlighting areas of friction or confusion in the current interface.

02. DESIGN

1. Workflow Wireframing: Wireframing ensures that all user requirements are captured before moving to visual design. Design Impact: This step helps in creating a logical and efficient user flow across all editors.

2. Design System Integration: Basing the new look and feel on an existing design system ensures consistency not just between editors, but across the entire Buildout platform. Design Impact: This approach speeds up the design process and creates a cohesive user experience.

3. Key Design Decisions:

1. Consistent Interface Elements: Using the same UI components and layout across all editors reduces the learning curve and improves efficiency.

2. Unified Workflow: Aligning the process of creating documents, emails, and website content creates a seamless experience for users working across different types of marketing materials.

3. Feature Parity: Ensuring that common functions are available and work similarly across all editors reduces confusion and increases productivity.

4. Implementation: Implementing a design that reveals advanced features progressively helps in managing complexity while catering to both novice and expert users.

5. Responsive Design: Ensuring the editors work well on various devices and screen sizes increases accessibility and user satisfaction.

6. Customization Options: Allowing for some level of interface customization can help users tailor the tool to their specific needs and preferences.

Conclusion

This approach demonstrates a user-centered design process that prioritizes consistency, usability, and modernization. By addressing the core issues of inconsistency and outdated features, the redesign aims to not only stop user churn but also to create a more competitive and satisfying product.

The emphasis on research, including both user feedback and behavior analysis, ensures that the redesign is grounded in real user needs and behaviors. This data-driven approach, combined with the application of design system principles, sets the foundation for a significant improvement in user experience across all of Buildout's editors.