Open Design System — Adding Semantics to Design System (Part-1): Background
“Design System” plays a critical role in bringing a common language and consistency in experience across different products and brands of the organisation, along with fuelling a collaborative approach towards design, making it easier for different team members to contribute.
With observation of design systems, we can notice, almost all of them are having different structure and approach to define these, and almost none of them can be directly used in automation of design as they are not semantic in nature. Therefore most of these current approaches to design systems are not future-proof for tomorrow’s design operations (DesOps).
Take an example of representation of information in a tabular form. In HTML, the desired table element does the basic thing work. But most of the real life sites, utillize the responsive frameworks like Bootstrap, and on the course they mostly use the framework versioned table component. For advance controlled display , some may use extended components based on the framework, e.g. Bootstrap Datagrid. In some cases due to the need from the two way data binding and similar needs application might be running Angular JS driven grids. Some other might prefer using some niche components like Data Tables. In many cases there are hybrid of niche components married to specific frameworks, for example the Data Tables with Bootstrap 4.
This actual shows how diversified is the form and the usage of components or the UI patterns. When such things happen, the amalgamation of associated design systems takes place. The target design system attributes, directions are used to customize, and in the process the guidelines based on which the external components, interactions, patterns and style are changed.
The power of design systems should lie in the fact that they can establish a common , publisher neutral platform integrating distributed computing as well as design eco-systems.
One of the barrier to wider adoption of SWS technology is the lack of tools for creating specifications that can help consumption as well as comprehension of the design systems at large by the systems without much direct human intervention.
The one of the major way out for such a future is using RDF or micro-data formats to define the ontologies through formats like OWL, RDFa etc.
The success of the Design Systems lies in their abilities, in becoming a part of distributed brand as well as design system, where any of the components or aspects can be extensible. Also the sustainability of the designSystems lies in the fact that they need to be migrated to and converge with any other design system. In the future of design operations, its highly possible in the world of CI&CD, the design systems should be able to be translated from one brand system to another effortlessly without the single human-intervention.
So what’s the way to achieve it?
The solution lies in Semantic Design System. Semantic Design System, is the future. Like Semantic web, the goal of the Design Systems is to translate from one form to the other, and ensure the machine readbility and comphrehensibility drives the dtructure and how the design system is fleshedout.
This is also, critical for open design systems, as the typical effort behind such systems is to make them available as more common set of patterns that can be adopted, used and extended by any other brand system. But as we diving towards the world of hybrid design systems, where the aesthetic as well as interaction enablement through CSS, JS frameworks are founding pillars, it is essential to provide a commonly used language that can define the basic relationships among different entities of a design system. The way forward is a design system defined in terms of a shared language or an ontology.
An “Open Design System”, as I envision, is the one that address this issue, and focuses building a design system, that is equally human-readable for collaboration and at the same time understood by the machine by being a “Semantic Design System” for the next generation of design operation with automation, machine learning and artificial intelligence. The talk also introduces, what I believes as “Nuclear Design”, an modelling approach (I will expand on this one in coming part of this series ) that helps to lay out a framework that is the foundation for building design systems with semantics.
The semantics of the ontology can be used by the machine learning or AI systems in similar manner how it is currently uses the data modelling using the graph databases. This opens up a door to the future for design that can support DesOps (aka. DesignOps) in organisations.
The Graph Data Model
The semantic web uses the graph data model to store data, RDF is the format in which it is written.
(Fig. Source: http://www.linkeddatatools.com/introducing-rdf )
In traditional data bases there are some kind of important elements against which the relationship is defined. In traditional data bases there are some kind of important elements against which the relationship is defined. uses graph structures for semantic queries with nodes, edges and properties to represent and store data.
Welcome to Open Design System Ontology (ODSO)!
(Continued to next post. )
Meanwhile, you can explore the following links:
Nuclear Design: https://www.linkedin.com/pulse/photo-essay-semantic-design-system-part-2-nuclear-model-samir-dash/
Open Design System Ontology: https://www.linkedin.com/pulse/photo-essay-semantic-design-system-part-3-open-ontology-samir-dash/?
© Samir Dash, 2018. All rights reserved. This content including the images are licensed under a Creative Commons Attribution 4.0 International license
