Quick start
The basics of how to make a digital product 'feel' like Malvern Panalytical.
Our design system helps us create consistent experiences across our websites and beyond. It also makes the design and development process faster, more efficient and scalable.
The basics of how to make a digital product 'feel' like Malvern Panalytical.
Colors, fonts, logos; it's all here.
Guidelines to help us make our writing clearer, simpler and more inspiring.
Styles and reusable building blocks of the system.
Franklin is Malvern Panalytical's design system for web-based marketing materials.
A set of brand guidelines and a library of HTML/CSS/JS components. Using this system is the quickest and easiest way to ensure your website or web-app is on brand.
The Design Systems Handbook by InVision is a great (free) way to learn more about design systems.
There are two other design systems in use at Malvern Panalytical.
Design system | MP User Interface Guidelines (XBL) | MP Sencillo | Franklin |
---|---|---|---|
Target | Desktop and tablet based software for our products | Web-based apps that are part of the Smart Manager platform | Commercial websites |
Goal | A common look and feel with a consistent user experience across all of our product software | Bridge the gap between our desktop software and our web sites, providing a familiar and branded experience | A common look and feel with a consistent user experience across all of our web sites |
Framework technologies | .NET C# and WPF/Xaml | .NET Blazor (C#), CSS and HTML | CSS, HTML and JavaScript |
Devices | Desktops and tablets | Desktops, tablets and mobiles | Desktops, tablets and mobiles |
Target Content Type | Fast changing, short textual elements, data visualisations and high user interactivity | Frequently changing, short textual elements, data visualisations and medium user interactivity | Infrequently changing, blocks of copy, marketing/product photos and low user interactivity |