---
title: Email Designer
slug: mexico-boot-camp-2024/email-designer
docTags: 
createdAt: 2024-01-22T15:42:14.371Z
---

This lab will walk through the steps to create an Email in Adobe Journey Optimizer.

NOTE:  Some exercises may vary during the actual Hands on Lab versus what is listed in the Archbee Page, due to industry setup and / or Presenter preferences.

## Create a New Message

1. Within the Basic Journey, click on Email action node 


   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/ScreenShot2022-08-19at10.57.06AM.png" size="50" isUploading="false" showCaption="false"}
2. Enter a Label and Description for the message.
3. Choose **Marketing **for Category and **MultiChannelMarketing **for Email Surfaces. 


   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/ScreenShot2022-08-19at11.55.20AM.png" size="50" isUploading="false" showCaption="false"}
4. Click on Edit Content


   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/ScreenShot2022-08-19at11.09.00AM.png" size="50" isUploading="false" showCaption="false"}

## Define a Subject Line

1. Enter a Subject Line. 


   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/image210.png" size="50" isUploading="false" showCaption="false"}
2. Click on the Personalization icon to add personalized data available for customer record. 


   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/ScreenShot2022-08-19at11.11.48AM.png" size="50" isUploading="false" showCaption="false"}
3. To add personalization, place your cursor where you want the personation added. Search for first name by searching for "first" and clicking the plus sign. Click Save.


   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/ScreenShot2022-08-19at11.16.28AM.png" size="50" isUploading="false" showCaption="false"}




   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/ScreenShot2022-08-19at11.17.26AM.png" size="50" isUploading="false" showCaption="false"}

## Design Email

1. Click Email Designer


   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/image287.png" size="50" isUploading="false" showCaption="false"}
2. Select “Design from Scratch”


   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/image222.png" size="50" isUploading="false" showCaption="false"}
3. Click on the 1:1 Column. Drag it 10 times onto the Canvas. Click Save


   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/image277.png" size="50" isUploading="false" showCaption="false"}
4. Select Content Components


   ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/image188.png" size="50" isUploading="false" showCaption="false"}
5. Add an Image Component in the first Component 
6. Add a Divider in the Second Component 
7. Add a text node in the Third Component 
8. Add a Divider in the Fourth Component
9. Add an Offer Decision in the Fith Component
10. Add a Divider in the Sixth Component
11. Add a Button in the Seventh Component
12. Add a Divider in the Eight Component
13. Add a Social in the Ninth Component
14. Add a Text in the Tenth Component
15. Select Browse to select an image. Choose Secur Financial available in the FSI folder in Asset Essentials

    ![](https://api.archbee.com/api/optimize/1Jp0iolWv35Z_mkI7oUiT/H3pJ7yN975DOKkcWFXJWb_screenshot-2024-05-16-at-110014-am.png)
16. Add a hero image to the email message (re-size if necessary, adjust the width under the styles section).
17. Click on the Offer Decision component. Then choose Email HTML as Placement type

    ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/ScreenShot2022-08-19at12.19.35PM.png" size="50" isUploading="false" showCaption="false"}
18. Choose the desired offer from the Offers Library. Click Add.

    ::Image[]{src="https://adbecdn.blob.core.windows.net/labs/archbee/gitbookAjoBase/ScreenShot2022-08-19at12.19.46PM.png" size="50" isUploading="false" showCaption="false"}
19. Under the First Text block, highlight the text, then click the personalization icon. Once the text editor pops up, delete the text and add something like: "Discover the perks of our Premium Credit Card Today" (If you have time, you could add personalization here, like the first or last name).
20. Double Click the button, and type "Apply Now".
21. On our last text node, let's highlight the text and make it a one click opt-out Link type.
22. Click Save to save the message and then exit out of the Designer.