Most business leaders understand that design is critical, but far fewer understand how to systematize it for sustained innovation and success.

21_design-mind_design-systems-101_dm_header-final

21_Design-Mind_Design-Systems-101_DM_Header-Final

Design Systems 101 

One of frog’s most significant early successes was the Snow White Design System. When the iconic Apple IIc launched in 1984, it defined the aesthetic of the emerging personal computer industry, helped turn Apple into a household name, and catalyzed Steve Jobs&#8217;s visionary reputation. But Jobs was one in a billion. It was Snow White that translated his unique vision into a system that could be consistently executed by the rest of his company. In those early days, only the most pioneering and design-centric enterprises understood the value of Design Systems. Today, no organization trying to deliver innovative products at any kind of scale can function for long without one.
Today&#8217;s business landscape has convinced even the most skeptical and practically minded leaders that design is critical for winning customers’ attention and loyalty through digital products and services. But even within organizations rushing to scale their design teams and implement DesignOps, there remain fundamental misunderstandings about Design Systems. Design Systems help to translate design’s unique capabilities across the vast and complex digital landscape, functioning as the practical embodiment of an organization’s design philosophy and creating the foundation for any successful DesignOps practice.
&nbsp;
<h2>What is a Design System?</h2>
A mature Design System is a living ecosystem of assets, tools, people and processes that work together to create harmony across products and platforms, raise confidence and familiarity with users, and save time and money for your organization. In the world of software, front-end is where users and potential buyers first experience and understand a product’s value. The primary purpose and value of a Design System is to enable great front-ends by helping organizations manage the tremendous challenges involved in creating cohesive, coherent digital experiences.
&nbsp;
<h3>A blueprint for consistent customer experiences</h3>
Enterprises win when they provide effortless and personalized customer experiences across every touchpoint. In order to do that at little to no marginal cost, they need an entire system of digital products tailored to specific user types and customer journeys, accessible on all major platforms (web, iOS, Android). With every additional product or platform, however, operation and coordination costs increase exponentially, grinding innovation to a halt. By investing in a Design System, enterprise teams can avoid stifling development costs as they innovate around customer needs, enabling them to &#8220;own all the glass” by providing the experiences customers demand on every channel.
&nbsp;
<h3>A product for building better products</h3>
Regardless of your industry or product, building great UX is a team sport. For organizations operating at scale, hundreds of designers and tens of thousands of developers could be collaborating on products and services at any given time. Design Systems aid this collaboration by centralizing many of the most significant coordination costs of large, cross-functional teams. By establishing systems and parameters that ensure consistency and cohesion across experiences, Design Systems allow teams to focus on shipping features that create the greatest value for users. Improved coordination increases both quality and speed to market, enabling test-and-learn cycles that realize value more rapidly and help organizations make better data-driven decisions.
&nbsp;
<h2>How do you create a Design System?</h2>
No two enterprises have the same needs or objectives, and that means there’s no one-size-fits-all approach to creating a Design System. While there are definite phases of Design System maturity, and while all successful Design Systems take some of the same overarching factors into account, each organization’s journey toward a fully-realized Design System will be organic and unique to its own culture and mission.
&nbsp;
<h3>Phases of Design System development</h3>
In our work with clients, we’ve observed three distinct phases of Design System maturity. Identifying which phase you&#8217;re in is a critical first step for any organization seeking to deploy their own Design System.
<img decoding="async" loading="lazy" class="aligncenter wp-image-21348 size-large" src="https://wp.frogdesign.com/wp-content/uploads/2021/03/21-Marketing-Design-Mind-DesignSystems101-trifinity-04-1024x434.jpg" alt="" width="640" height="271" srcset="https://frogdesign.nyc3.digitaloceanspaces.com/wp-content/uploads/2021/03/05213450/21-Marketing-Design-Mind-DesignSystems101-trifinity-04-1024x434.jpg 1024w, https://frogdesign.nyc3.digitaloceanspaces.com/wp-content/uploads/2021/03/05213450/21-Marketing-Design-Mind-DesignSystems101-trifinity-04-300x127.jpg 300w, https://frogdesign.nyc3.digitaloceanspaces.com/wp-content/uploads/2021/03/05213450/21-Marketing-Design-Mind-DesignSystems101-trifinity-04-768x326.jpg 768w, https://frogdesign.nyc3.digitaloceanspaces.com/wp-content/uploads/2021/03/05213450/21-Marketing-Design-Mind-DesignSystems101-trifinity-04-1536x652.jpg 1536w, https://frogdesign.nyc3.digitaloceanspaces.com/wp-content/uploads/2021/03/05213450/21-Marketing-Design-Mind-DesignSystems101-trifinity-04-2048x869.jpg 2048w" sizes="(max-width: 640px) 100vw, 640px" />
Phase I: Imagine 
For most enterprises, the first step toward a great Design System is creating a great product. In this phase, it’s all about finding ways to solve user problems more effectively and efficiently than the competition. Once you’ve nailed this product-market fit, you will either experience or anticipate massive growth in consumer demand for your product. Demand validates both the need for and the viability of a Design System.
Phase II: Make 
Once you have a winning product, its user experience can be “modularized” into its component parts. These experiential building blocks are the foundation of a user interface (UI) framework, which can be rearranged and redeployed like Lego bricks in order to help build new products and experiences. Once the UX has been modularized, the components can be “industrialized” by integrating them into existing design and development workflows, reducing friction to their adoption and use. When modularization and industrialization are accomplished, you have a nascent Design System.
Phase III: Scale 
In the final phase, a cross-functional design, product, and development team implements and scales the Design System in order to support other teams in building new products and features.
The most successful organizations scale their Design System holistically, considering critical dimensions such as the overall purpose of the system, the talent and tools it requires, the processes and structures that link talent and tools together, the organizational culture the system fosters, and how its results can be measured.
&nbsp;
<h2>A system for scalable success</h2>
When enterprises effectively leverage this approach, they’re able to unify business concerns and design processes. The Design System acts as a single source of truth for large-scale product design, providing an “automated” workflow that’s backed by modular tooling that integrates design seamlessly into the product development lifecycle.
As your products evolve, however, so must your Design System. By enhancing the entire system through ongoing governance processes along with quality, value, and version control, organizations can ensure that their Design System serves as a foundation for long-term innovation and success.

Sean Rhodes

Albert Dang

Authors

sean-rhodes

DesignOps elements to help amplify the value of your organization’s investment in design

frog_dm_designops_101_header

frog_DM_designops_101_header

DesignOps 101

Like many methodologies throughout the digital boom, DesignOps is having a “moment.”
What is DesignOps? 
DesignOps is a human-centered approach to building stronger design teams that support the orchestration of individuals, processes and tools to amplify creativity and impact at scale. Similar to DevOps, which has revolutionized the development process with an agile, iterative approach, DesignOps allows organizations to rapidly scale and iterate design processes across teams.
Why is DesignOps important now? 
Today, organizations realize the importance of digital experiences to create more meaningful customer relationships and understand the value of designers’ creativity, empathy and innovation as part of their winning strategies. These organizations invest in building large design capabilities to imitate the success of other leaders moving at a world-changing velocity and scale. Organizations often struggle to unlock the full value of their investments, not because of the strategy or the specific designers that have been hired, but because the team has not been set up for success organizationally. This is a common challenge we see when working with clients to <a href="https://www.frog.co/services/org-activation">activate their organization</a> for success or innovation.
This is where DesignOps comes in. The idea of the lone wolf genius designer is dead. Today, design is an inclusive team sport. DesignOps is about holistically enabling high-performance collaboration between designers and their partners like engineering, marketing, business and product managers.
The following elements of DesignOps will help amplify and extend the value of any design team.
The objective of DesignOps is to support the design team in alignment with the customer-centric vision of the organization:
<ul>
<li>DesignOps starts with a focus on humans; our customers. When designers have the tools and processes to respond to the customer—and the permission to look to the future—those teams deliver on a meaningful vision that sustains deep customer relationships over time.</li>
<li>Meaningful customer experiences are where the rubber meets the road. The products and services designers help create support how a customer feels across the journey engaging with various touchpoints and interactions within an organization. Delivering great experiences is the entire point.</li>
</ul>
The inputs guide the design team’s ability to effectively fulfill the objective by enabling them to deliver at scale for the organization:
<ul>
<li>Purpose demonstrates why the design team exists and how they will win. As a design team matures, its remit becomes increasingly holistic and strategic, creating greater value for the organization.</li>
<li>Talent is the heart of your design team. DesignOps enables a positive employee experience, determines your organization’s ability to attract and grow top talent, and focuses on capabilities and behaviors aligned with the purpose.</li>
<li>Processes are the key rituals that “turn people into teams.” These linkages enable how information flows across stakeholders, teams, management and operations. They create connections that might not otherwise occur to combat siloes, facilitate knowledge sharing, advance decisions, define success, collect feedback, capture learnings, and celebrate success. Processes help to determine how and when design fits into the right moment, and when to leverage methods like lean, SCRUM, agile and others for the best outcome.</li>
<li>Enablers are the tools and assets that enable work. Enablers focus on communication tools, facilitation of collaboration, reviews and feedback mechanisms to facilitate learnings, inform decision-making and drive better team efficiencies. There are many dynamic and evolving cloud-based collaboration tools that amplify a designer’s impact by removing points of friction between design and collaborators in engineering.</li>
<li>Structure determines how decisions get made and where power and authority are placed. Determine the organizational structure that design operates within or across functional teams, such as product, innovation, IT, or the organization at large. Design should be operating at the right altitude for the problem and need, be it strategic or tactical. Physical working environments also send strong signals about how work should flow.</li>
</ul>
The outcomes provide evidence that the design team’s creativity is being employed to accomplish the objective:
<ul>
<li>Culture is how it feels for a designer to work in your organization. A meaningful culture empowers employees with a clear understanding of how their contributions enable the overall purpose, and gives them the autonomy and agency to contribute in a manner that is empowered by process, tools and structure.</li>
<li>Results are how impact is measured and crosses business (ROI, revenue / spend KPIs, customer satisfaction / retention), efficiency (time to market, ways of working) and culture (impact, job satisfaction). We create a set of design standards that define what good experiences look and feel like and have the means to deliver them effectively to the market.</li>
</ul>
DesignOps focuses specifically on enabling designers to accomplish the most meaningful work possible, bolstering both creativity and overall impact. Of course, every organization’s design team will have a unique blend of goals and maturity level. It takes a careful orchestration throughout the organization to allow design to become a part of the working fabric of day-to-day operations. By helping our clients deploy DesignOps successfully, we’re helping them design for change that lasts.
Our mission is to create products and services that transform businesses at scale. DesignOps has been central to enabling our client’s success in unlocking the power of design in their organizations.

Sean is a leader with a passionate belief in the power of design, technology and business to shape the world we want to live in. His focus has been building world-class teams and environments for multi-disciplinary collaboration that delivers creativity and productivity for product and service design.

Find out where the next wave of innovation in financial services will come from.

23_c-series-cc5_share-image

23_C-Series-CC5_Share-Image

Banking on Invisibility

Create products and services that connect people, planet and progress.

connected-world-share-image

Connected-World-share-image

Connected World

23_podcast_ep36-dan-roberts-dm_thumbnail

23_Podcast_Ep36-Dan-Roberts-DM_thumbnail

Design Mind frogcast

frog's track record in delivering value though design at scale shows we have DesignOps in our DNA

desops-dna-tw

DesOps-DNA-TW

DesignOps—It’s in Our DNA

In the past decade, many of our clients have invested to make design a core capability, essential to their growth and innovation imperatives. As these design teams have scaled their collaboration inside their organizations, the need for greater operational support to enable their success has emerged. But DesignOps is nothing new for frog. As a global team with hundreds of highly collaborative designers and technologists, frog has DesignOps in our DNA. Our 50-year-history in DesignOps is reflected in our internal culture that has enabled our long and successful track record with hundreds of products and services brought to market.
We define DesignOps as a human-centered approach to the orchestration of design teams, processes and tools to amplify creativity and impact at scale. frog partners to leverage our experience in supporting the establishment, scaling and maturity of internal design capabilities for these organizations. We have served clients across multiple industries with products and services spanning enterprises and consumers—so much so, that many frog alumni have been hired to run DesignOps for successful companies across industries including Salesforce, Fitbit, Uber, InVision, Youtube, AirBnB, USAA and Microsoft.
We see DesignOps as one of the key points in the intersection of digital transformation, design thinking, customer experience and agile product delivery. It’s not just a standardized methodology to adopt—it’s the orchestration of all these parts that helps bring success to organizations of any size.
One nexus of this orchestration is the design language system (DLS), which enables design teams to support better outcomes like large scale consistency, quality and speed across broader organizations. frog has long recognized the value of design systems for DesignOps. In fact, our first design system was created for Apple back in 1984. The <a href="https://en.wikipedia.org/wiki/Snow_White_design_language">Snow White design language</a> helped the organization to establish a bar for Apple product excellence resulting in their legendary fanatical customer base.
Now with software as an enabler to rapidly iterate and scale, our design system experience is as important as ever to delivering products and services that customers love. In the last 20 years, we’ve created over 30 DLSs that have garnered great outcomes for our clients. In 1998, we helped Dell design its massively successful e-commerce site. The design system we established with <a href="https://www.frog.co/work/ge-digital-transformation">GE</a> in 2011 to support industrial IOT applications enabled a 100 percent productivity gain and a savings of $30M in development costs in the first year. In 2014, we partnered with Intuit, an early enterprise design investor, to create the Harmony design system, which supported the redesign and cloud enablement of the Quickbooks product ecosystem leading to 30 percent revenue growth and 2X improvement in their NPS score. Recently, <a href="https://www.frog.co/work/porsche">Porsche</a> has released the successful Porsche Connect and Porsche Offroad Precision native apps (with more in the works), both supported and enabled by the design system frog helped to establish in 2017. Last year, we helped our venture client <a href="https://www.frog.co/work/reimagining-the-ride-ahead-with-alto">Alto</a> go from napkin concept to Pilot launch in 12 months through a combination of tools and ops that streamlined digital and service design and delivery.
frog’s mission is to create products and services that transform businesses at scale. Our DesignOps services have been central to enabling our clients’ success in unlocking the power of design in their organizations. We love what we make, and we love helping our clients bring new products and services to market. But it’s not just about helping clients design for the moment—rather, we design for their long-lasting future. With a considered approach to the people, tools and collaboration involved in any product development, we believe our approach to DesignOps not only helps clients get to market quickly but get to market with the right thing to build customer relationships that last.

<div class="divider grid-center ">
<div class="col-12">
<div class="text-content grid-center ">
Sean is a leader with a passionate belief in the power of design, technology and business to shape the world we want to live in. His focus has been building world-class teams and environments for multi-disciplinary collaboration that delivers creativity and productivity for product and service design.
</div>
</div>
</div>
<div class="divider grid-center ">
<div class="col-12">
<div class="text-content grid-center ">

</div>
</div>
</div>

Albert helps clients innovate by bringing new products and services to life through a blended practice of strategy, design, and technology. As a director of Design Technology, Albert has helped in shaping the Design Technology practice for frog at-large and our NY Studio.

	Global		EN
	France		FR

	Global		EN
	France		FR

Albert Dang

Featured

DesignOps 101

Articles

Our Studios

Careers