With atomic design system architecutre in mind, we have developed our templates and configuration functionality with that architecture. We are gradually improving our design toolkits to provide the control to designers on what you can change. Our goal is not 100% customisation but finding the middle ground on what is important to launch a business quickly and take the evolution approach in long term. Drastic customisation is always possible when you code from scratch, so use our open source kits to start from.
As of now, all the things we allow to customise is available under Simple Design Editor, you can play around (it has a draft and live mode)
By Atomic Design, here is the customisation you can make.
Atoms
Label
Input
Button
Color (Available in Editor)
Fonts (Available in Editor)
Text Styles
- Headings (H1) (Editor in 2023 Q1)
- Headings (H2) (Editor in 2023 Q1)
- Headings (H3) (Editor in 2023 Q1)
- body (Editor in 2023 Q1)
- caption
- Links
Molecules
Molecules are combination of atoms. When Editor allows you to change the atoms, it means your molecules are customised automatically.
In future, we would like to make it possible to
- Navigation
- Input Controls
The advanced set of things we are not sure whether we can do that in Year 2023
Style of
- Dropdown List
- Toggles
- Sliders
- Tabs
- Pagination
- Date Fields
- Checkboxes
- Radio buttons
Organism
Organism are combination of multiple molecules.
In Tradly, we define organism as
- Listing form
- Account form
- Order List
- Order detail page
- Listing detail page
- Account detail page
- Shipping / Service Selection
- Payment selection
- And others
Components
Each templates comes with it’s own card style. However it is possible that V2 templates will allow you to change
- Card size (height and width) - Available Now
- Card Borders (Editor in 2023 Q1)
- Card shadows (Editor in 2023 Q1)
Not just listing cards, all other cards will share a unified styling (like borders, shadow)
Organism data can be managed from Superadmin.
- Order of the molecule present inside them(order number)
- Strings inside them (label, input, tooltips)
- Data coming into that pages (restricting from superadmin what to come, not to come, hide, can edit or not, etc)
- activate or deactivate certain fields. (It’s not say design specific customisation but from a holistic standpoint)
Templates
The word templates we use from our platform or product specific totally varies from the design system.
Templates in Tradly means
- A collection of pages.
- And the Pages is the collection of atoms, molecules, organism.
Templates can be a simple sherable card as a image, or a single page which has a URL or multiple pages template.
Example:
- A Shareable card is a product promotional card, account card, Packaging Sticker, etc
- A Single Page which could a restuarant QR Code menu, a grocery shopping page, a thematic collection page, a single order form for agents, etc
- The traditional e-commerce store(with catalogue, orders page, checkout), marketplaces, directories, etc. All this has multiple pages
Pages
Tradly introduced a composer in 2023. With additional to pre-built templates, we allow you to make custom templates with pages. or a Pages with variety of components inside it.
A Slash based composing tool that will be provide you an flexibility to add different components(molecules or organism inside) such as
- Write with formatting
- Embed any future widgets we release (Example: multiple types of listing card, collections, promo banners, search, etc)
All the items that you add in the pages through the composer will have unified style from the Design Editor. Because the components (organism & molecules) are made of Atoms. And atoms is in Editor.