Story 3-landing page with form wall

1,515 views

Published on

Wireframes for next generation of eZ Publish Editorial Interface. Please visit http://share.ez.no/blogs/ez-publish-next-ui/ if interested.

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,515
On SlideShare
0
From Embeds
0
Number of Embeds
484
Actions
Shares
0
Downloads
6
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Story 3-landing page with form wall

  1. 1. Redefining eZ Publish User Interface on eZ Publish 5 UX & UI concepts First phase of six end-to-end user stories to lay the foundations of the new interface. 3. Landing Page with formwall Any marketer‘s dream
  2. 2. As a user, I will... ...create a new landing page for a whitepaper lead-generation campaign ... edit the marketing editorial (text and image) for the campaign ... create the form used to capture leads / prospects and test itIntention• introduce the new landing page manager, in the IUI (Insite User Interface)• showcase a new form builder in the context of a marketing landing page• demonstrate how the search discovery can be use at different place of the interfaceWe will show• create content in IUI• create a form using the form builder• integrate a document to download after completing the form 2
  3. 3. I will start by simply creating a new “Landing Page” object. As a first thing, I will choose the layout of the landing page I want to create. (some people call this ‘zoning’) 3
  4. 4. Createlanding pageAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 4
  5. 5. One my page is created, it is obviously blank. I will be able to create blocks in the different zones of the zoning.The action toolbar on the right shows all the block types available on my eZ Publish installation.I will simply drag and drop the blocks I want! A drop zone, with color code help me to clearly identify the zones. 5
  6. 6. EditAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 6
  7. 7. I want a short editorial on the left,to communicate the value of the whitepaper I want to offer for download. Luckily, I already have content for that in my content repository,so I will just reuse and embed this content, an article called “Reaching for the stars”. For that, I use an “embed object” block, search for my content that I will then add to the block. 7
  8. 8. EditAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 8
  9. 9. Once this is done, I will simply add a “Form” block on the right zone. Once I dragged the block, I enter the form editor. The form editor follow thesame principles: the form can be edited in an overlay, it has both settings and a collection of fields. I can simply drag and drop fields from the action bar to the form and edit them to create my form. 9
  10. 10. EditAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 10
  11. 11. Edit formAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 11
  12. 12. Edit formAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 12
  13. 13. Edit formAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 13
  14. 14. Edit formAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 14
  15. 15. Edit formAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 15
  16. 16. Edit formAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 16
  17. 17. Once this is done, I feel I am all set, I can publish and test. Huray! 17
  18. 18. ViewAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 18
  19. 19. ViewAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 19
  20. 20. ViewAs a Power User I wantto use IUI to create anew Landing Page andadd a form to it to hide adownload behind it. 20

×