Once your wireframes are ready, you can start working on the more advanced design that will give you a high-profile visual draft. 

At this point, you can start to focus on more details. Adding in colours, typography and placeholder images to your sketch. These will give you a more realistic impression of how the Email Design System will look. As opposed to a wireframe, it’s best to use a dedicated tool to create your design, such as Photoshop. 

Present the final design to your team

Similarly to the previous step, once your design is ready make sure you present it to your team, gather their feedback and make a few adjustments. However in addition, you’ll now also need to work alongside the developer that will build the HTML of the Email Design System for you. They will be able to give you insights into what is/isn’t possible when coding the elements, which is crucial to know at this stage.

Unarguably, there is a lot to consider before starting to write the HTML of your new Email Design System. Most importantly, you need to know what exactly you’re going to build. It’s difficult to start a project without a solid action plan.

Taking a step back to review the email marketing campaigns you have sent out so far, keeping on top of the email industry trends, analysing what would work best for your brand and making sure your Email Design System is going to stay aligned with your brand guideline are great starting points and essential parts of the process. 

Once you’re happy with the final design, you are ready to move forward and focus on the build part of the Email Design System. 

Next: Once your design is ready, you can finally start building your new Email Design System