For this project, I was tasked with creating a new feature that utilized a 3rd party html editor. This new editor would be used to let our clients create their own email templates so they can save time when sending thank-you emails to their donors. I did my usual assessment and conducted several rounds of usability testing - you can review my process here.
Usability testing provided a lot of positive feedback and some helpful suggestions as well - such as how we handle entering multiple addresses into one field. Some used commas, others used semi-colons. My question - why not both? Clients have been trained over the years through email clients in different ways inputting multiple email addresses, we should leverage that.
I produced a variety of wireframes to explore different ways we could approach an email template library that was new, but also needed to feel integrated with the older styling of the desktop app. Oh, and we also had to account for users being able to insert custom fields on their template as well - and a way to create a PDF version of their email for tax purposes.
After a few more rounds of adjustments this is where I initially landed. It utilizes a tabbed workflow with dynamic text that lets you know if there is an attachment or not. Historical information was added so users could see who created the template and when it was last changed, a new multi-select component was added to let people add codes to their templates, and the merge field button was restyled to look more like a native part of the new html editor (even though it wasn't). So far clients really enjoy this new feature, and we've seen significant feature adoption as well. If I were to build this out more, I would add in best practice tips to the sidebar and other helpful information to help encourage them as they work on their donor relationship building.