Brightidea · Whiteboard
Time Period
2021-2022
Disciplines
Vision, Strategy, Product Design, Product Management, UX, User Research, Market Research, Interaction Design, Product Launch (0-1)Bridging the Brainstorm Gap for Enterprise Innovation
Project Background
The Problem
Innovation managers and design facilitators struggle to manage ideas generated by their teams during brainstorming sessions. Popular digital whiteboards (Miro, Mural, FigJam, et al) are isolated in silos, making it difficult to track, evaluate, and integrate ideas into a formal enterprise innovation pipeline.
The shift to remote work during the pandemic has exacerbated this problem, increasing reliance on digital collaboration tools.
Further, employees face friction to submitting and collaborating on ideas within existing Brightidea workflows, hindering participation and execution.
The Business Case
Brightidea’s platform excells at asynchronous idea management but falls short for real-time collaboration. Competitors are rapidly capturing market share in this growing segment, although they do not offer complete end-to-end innovation management solutions. This gap is an opportunity to expand deeper into the organization.
Role
As Product and Design Lead, I worked directly alongside the CEO to define product vision, strategy, and UX architecture. I then led design and development for the zero-to-one release, plus two quarterly updates.
Duration
- Initial vision, strategy, and early architecture: ~3 months (parallel with other projects)
- Core development with dedicated team (v1 release): 6 months
- Iteration: daily bug fixes, weekly UX updates, and feature releases quarterly
Starting at the End
Vision
We aimed to create an intuitive and powerful real-time whiteboard experience, seamlessly integrated with Brightidea’s platform, enabling teams to brainstorm effectively and manage the entire innovation lifecycle in one place–from ideation to execution.
Process
Discovery & Research
Market research was conducted to analyze the digital whiteboard market. This highlighted rapid growth driven by the rise of remote work in the pandemic, and the increasing demand for real-time collaboration tools.
Competitive analysis enabled us to evaluate existing players like Miro, Mural, Microsoft, and FigJam. While recognizing the commoditized-but-essential nature of many whiteboard features, the analysis honed in on identifying opportunities for differentiation through integration with our existing platform.
The key differentiator was Brightidea’s robust enterprise functionality and its ability to connect brainstorming to all other innovation activities across an organization. This was further supported by analytics, reports, and access controls. We had opportunity to capitalize on a common painpoint: what happens after a brainstorm?
Importantly, we would also be competing against offline, so we went back to analyze how in-person brainstorming sessions were being conducted. Specifically, the LUMA methods came up frequently interviews and requests. I am a LUMA Certified Practitioner, so was able to provide insights into those tools and needs.
User interviews with innovation managers and users of Brightidea products uncovered significant pain points around capturing, managing, and tracking ideas generated in brainstorming sessions.
Finally, data analysis tapped into Brightidea’s Idea Space community to glean any additional feedback or unmet needs. We use Brightidea to build Brightidea, and this is where we collect ideas, feedback, and suggestions from our users. We coupled this with basic ease-of-use metrics from existing products to understand how users were currently managing ideas and where the most significant gaps existed to speed up the idea-capture process.
Definition & Strategy
I worked closely with the CEO to define the product vision, strategy, and key differentiators as described above. This collaborative process aligned on target users, core features, and business goals, ensuring that Whiteboard would address both user needs and strategic business objectives.
Defining the MVP: Valuable integration with the existing platform was a primary focus. We prioritized two sets of features for the initial release:
- “Table stakes,” commoditized whiteboard functionalities necessary to compete in the market.
- Innovative features that emphasize and leverage Brightidea’s strengths or unique capabilities.
Roadmap: We developed a product roadmap outlining swimlanes of functionality for the initial release and subsequent iterations, demonstrating a clear path for building upon the MVP and incorporating user feedback in all areas of the product.
Early Architectural Work: I collaborated with the engineering architect during the foundational work, ensuring the technical architecture would support the product’s performance and scalability requirements, as well as the featureset.
Design & Development
Design Shaping: There was much divergent exploration in this phase by means of sketches, wireframes, and Figma prototypes, exploring different approaches to application layout, individual features/tools, and user flows.
Execution: Once the foundational directions were set, we brought on a pod of engineers, another designer, and a product manager, establishing a strong team to execute on the product vision.
Collaborative Design Process: the design process was highly collaborative, involving the CEO, a product manager, the engineering lead, and a second designer. We also interfaced with another product manager and engineering leads for the platform integrations.
A book could be written of Brightidea’s inhouse “Design Review” process, so suffice to say it is open, rigorous, meritocratic, and iterative–all to ensure that “the best ideas win.” We practice what we preach when it comes to collaborative innovation and a culture of ideas.
Since this process was entirely remote during the pandemic, we relied on Brightidea and Figma for everything including idea tracking, research, roadmapping, shaping, wireframing, mockups, prototypes, and design reviews. This accelerated our learnings and the development of a realtime collaboration tool of our own.
Dogfooding & Internal Feedback: We became heavy users of Whiteboard internally for our own product development, replacing Figma for brainstorming, research, and strategic planning. This dogfooding provided valuable real-world feedback and helped refine the product based on internal usage patterns and acute familiarity with painpoints.
Beta Testing with Innovation Consultants and Customers: We engaged Brightidea’s innovation consultants to use the product in beta stages, gathering feedback from their perspective and from early-access customers participating in guided sessions.
Design Details
Getting the interactions right on the canvas took extreme focus. While establishing a vision and the high-level design was exciting, my most enjoyable moments were working with the engineering lead to define and perfect the myriad of interactions on the board. This is one of those areas of design that users will take for granted if done well, but will completely break the feel of product when done poorly.
I’ll keep it brief, though there were innumerable compounding variables including:
- Navigation and selection: including mouse, keyboard, and trackpad/touch, as well as combinations like shift+drag
- Object states: like selected, hovered, focused, active, and further complicated by multi-player states
- Object interactions: for example resize, rotate, scale as well as affordances for changing states and modes. The hotspots also needed consideration as to where they appear on an object and how they behave around neighbors and at different zoom levels.
- 3-dimensional hierarchy: the whiteboard seems 2D, but exists as a 3D space, which can be illustrated with zoom. Objects are stacked on the canvas (e.g. one sticky overlappying another), and UI is also stacked in the z-direction, above the canvas. Some effects fall in between conceptually–like object selection, which feels best when it “burns through” by displaying non-physically above all the canvas objects, regardles of the selected object’s index.
- Sizing and scaling: getting the relative sizes right with appropriate scaling factors also proved to be a challenge. Another neat note about this, is considering which classes of objects always stay the same size on screen vs. scaling when the canvas is zoomed. For example, grab handles stay the same size on screen regardless of zoom factor, but disappear when a certain threshold is reached where they would become impossible to use.
Please forgive the lag in the recording below, illustrating a few of these considerations:
Launch & Iteration
Go-to-Market: Our marketing team interfaced with our incoming Head of Product to develop launch materials, which I helped to support as far as capabilities, assets, and access. GTM leveraged various channels to promote Whiteboard to existing and prospective customers. The launch included blog posts, a press release, and targeted outreach. Check out the official launch video telling the Brightidea Whiteboard story, crafted by the marketing team:
Post-Launch Feedback: We continuously collected user feedback through various channels where I often engaged directly with users–including Brightidea’s Idea Space, customer support interactions, and calls with users.
Ongoing Insights & Iterative Improvements: In addition to using the roadmap as a guide, we implemented key features in subsequent releases, such as “Follow” and “Huddle,” based on user feedback and insights gathered from usage data. These features addressed specific needs related to remote collaboration and innovation management.
Technical Decisions: When we first began thinking around this project circa late 2020, many of the realtime collaboration apps felt laggy, glitchy, and clumsy to use. Upon investigation, they were found to use common web-based technology that was not originally designed to be pushed to these limits. Being entirely user-centric in our decision, we established that our product must transcend these constraints. Dozens of people needed to be able to collaborate on hundreds of ideas, all while tapping into the power of the platform (i.e. Smart Objects).
Fortunately, we found inspiration in Figma, which was an obvious outlier at that time, and we made the decision to build Whiteboard on WebAssembly using Rust and WebGL after a bit of testing and prototyping by engineering. This was critical to providing the multiplayer UX that we needed, as well as the infinite canvas and smart object capabilities.
Results
Quantitative
- Rapid Adoption: Brightidea Whiteboard saw immediate success, with over 1,100 new whiteboards created within the first four months, demonstrating strong product-market fit and seamless integration into the platform.
- Sustained Usage: Consistent daily creation of new Whiteboards indicates that the product provides ongoing value and has become integral to users’ workflows.
Business Impact
- Complete Platform and Improved Retention: Whiteboard filled a critical gap in Brightidea’s offering, providing a complete end-to-end innovation management solution. This has led to improved customer retention as well as expansion within existing accounts.
- Enterprise-Grade Differentiation: The unique ability to connect brainstorming to all other innovation activities, metrics, analytics, and access controls sets Whiteboard apart from competitors and solidifies Brightidea’s leadership in the enterprise market.
- Positive Reception: The launch garnered positive feedback from users, highlighting its inclusive nature, and significant industry attention through press coverage, validating its value proposition.
This new and fully integrated product completes Brightidea as the only platform you need to manage the entire innovation lifecycle, from initial spark of an idea to measuring implementation impact.
Reflection
Learnings & Takeaways
- Focus on the user: By listening to customers and always digging deeper to their underlying needs, we were able to reliably derisk and inform design decisions while ensuring we were always delivering real value.
- Leverage your strengths: Integrating real-time collaboration with the broader enterprise platform was crucial for differentiating our product in the market and delivering that value to our target personas.
- Embrace “dogfooding”: Using your own product internally provides invaluable insights and helps refine the user experience much faster. Usability and quality-of-life requests are much more easily sold to cross-functional stakeholders.
- Technology serves the user experience: The decision to go with WebAssembly was exciting for engineering, but more importantly offered significant advantages for building the high-performance, scalable solution our users needed.
- Team leadership in a dynamic environment: Building and leading a new team requires adaptability, clear communication, perseverance, and a strong focus on collaboration.
Design Challenges
-
Balancing a rich feature set with simplicity and ease of use: Prioritizing essential features for the MVP while ensuring a user-friendly interface was a key challenge.
-
Ensuring seamless integration with the existing platform: Creating a cohesive experience between Whiteboard and the broader platform required careful planning and close collaboration between teams.
-
Competing with established players in a crowded market: Differentiating Whiteboard from existing solutions required a strong focus on unique value propositions, such as deep platform integration.
-
Adapting to the rapid shift to remote work: Meeting the evolving needs of remote teams demanded agility and a willingness to iterate quickly based on user feedback.
-
Technical Implementation: Bridging the gap between the robust technical foundation and the desired user experience presented unique challenges that required creative problem-solving.
Product summary:
- Real-time collaboration (shared cursors, follow mode, huddles)
- Standard whiteboard tools (sticky notes, shapes, text, images, freehand pen)
- Reactions and stickers for engagement and lightweight feedback
- Pre-built templates for jump-starting innovation activities
- Synchronized activity timer
- “Smart Matrix” for idea evaluation and stage-gate routing
- Platform integration (seamless idea creation, unified tracking, metrics, and analytics)
- Straight-forward sharing and access controls
- Zoomable User Interface (ZUI) for both detailed work and broad context views
- High performance and scalability, offering users an infinite canvas and massive multi-player capability
Thanks for reading! Contact me to discuss opportunities, or learn more about Brightidea Whiteboard.