Why Components
In software development is easier to design a solution by creating modules or components instead of solving a whole.
In the MPC team we are aware that our solutions, our components are a vertical element integrated in the marketplaces. But as UXers we also know that the UX design needs to offer a horizontal experience for our users.
Taking one of our componentes, Messaging, as an example, we can tell you about a successful case of a component that provides a solution that is already working in many marketplaces.
6 TIPS TO DESIGN YOUR COMPONENTS
-
1. WHITE LABEL DESIGN
The components needs to be BRAND FREE, and at the same time, easly to brand
-
2. SCALABLE TO DIFFERENT LAYOUTS
The marketplaces will place our component somewhere in their layout, so keep in mind:
- Responsive layouts (break points)
- Ad banners placement
- Navigation elements
- Component placement size…
-
3. TECH-STACK AGNOSTIC
The component will live surrounded by different technologies, which means
- Avoid dependencies on other technologies/frameworks
- The shipped component should not require technical additions to the MP
- Keep UX and Tech separated
-
4. FEATURES UNDER A TOGGLE
Think that maybe a marketplace may not have certain features implemented on your component, but this shouldn’t be a blocker to use the rest of them!
e.g. Marketplaces with and without avatars -
5. LOCALISATION
Messaging is currently present in several countries with different
- word length
- alphabets
- date formats
- special characters
-
6. SMALL AND FAST
The component will be part of a whole bundle, if we keep it lighter, the impact on the whole bundle size will be smaller. Also for performance purposes we suggest to avoid 3rd parties libraries or plugins.
INTEGRATING THE COMPONENTS IN THE MARKETPLACE
This is probably the most challenging part of our team. A constant communication with the marketplaces, creating empathy with them, keeping people passionate about the product…
We can select any design process but is key to keep people updated with the product evolution. Personal meetings, sync sessions, slack channels, etc.. will build relationships and add transparency in the development process. Sharing our process soon will also raise problems we can solve in an early stage.