...
...
...
Description
...
Move current form functionality from campaign level to global level.
...
Type
...
Roadmap Feature
...
Story
...
Mockup
...
https://projects.invisionapp.com/share/E9SGBSZUX35
...
Ticket
...
Assets
...
https://drive.google.com/drive/folders/1HW8DIZ5P6llBtmb-ZVmNWLuWd2Eg02be?usp=sharing
Quantitative Data:
Info |
---|
Data driven justification for ux/ui changes, especially necessary for organic changes that do not originate from client requests or roadmap features. |
...
Source
...
Link
...
Description
...
Findings
Competitor Research:
...
Function
...
Findings
...
Image
...
Takeaways
...
Navigation Structure
...
Hubspot
Navigation is under a subsection of ‘marketing’ but still its own entity
Marketo
‘Forms’ have their own section under main navigation
Mailchimp
Dedicated navigation item for forms
Eloqua
Global forms under subsection of ‘assets’
...
Status | ||||
---|---|---|---|---|
|
‘Forms’ navigation to be a prominent section of platform function, implies global management and functions and moves away from one-to-one campaign and form relationships
Status | ||||
---|---|---|---|---|
|
Status | ||||
---|---|---|---|---|
|
...
Forms Listing Page
...
Hubspot
Form listing includes unique column ‘appears on’ which is useful to show relationships between forms and their containers.
‘Create’ folder functionality to organise forms
Actions to manage form on form hover such as ‘delete’ and ‘duplicate’
Marketo
‘Used by pages' gives indication of links/relationships
‘Archive’ folder included for organisation
Ability to create custom folder to further organise forms
Actions to manage form such as ‘clone’ and 'delete'
Eloqua
Various filters to show forms that are ‘recently accessed/modified'
Additional folders for extra organisation
...
...
Status | ||||
---|---|---|---|---|
|
Include indication to show the linked forms/campaigns
Include usual management tasks such as ‘delete’ and ‘duplicate’
Status | ||||
---|---|---|---|---|
|
No custom folders or ‘favourites’ section, as this would be inconsistent with rest of the platform and maybe cause too much confusion for non power-users as a v1 release
No extra filters for ‘recently accessed/modified' as all platform tables show default ordering as chronological from newest to oldest or alphabetical, including these would be inconsistent
Status | ||||
---|---|---|---|---|
|
...
Form Reporting
...
Hubspot
The main click-through from form listing goes to for performance/reporting page
...
Status | ||||
---|---|---|---|---|
|
None
Status | ||||
---|---|---|---|---|
|
We don’t require any sort of form reporting at the moment, but may be useful in the future if this is something we want to include for A/B testing purposes?
Status | ||||
---|---|---|---|---|
|
...
Form Editing
...
Hubspot
Form editor actions dropdown containers various items, most notably ‘delete’ and ‘clone' and ‘create translation’
Marketo
Form editor opens up in new window
Eloqua
Various actions shown within form builder so users don’t have to go back to form listing to perform management tasks
...
...
Status | ||||
---|---|---|---|---|
|
Allow form management control from within form builder for easier access without having to go to form listing to manage form, e.g. archiving, duplicating, etc.
Status | ||||
---|---|---|---|---|
|
Don’t open in new tab, as we don’t do this anywhere else on platform, keep consistent and open in same page, and this way would still allow users to right click and open in new tab
Status | ||||
---|---|---|---|---|
|
...
Form Actions from Container
...
Hubspot
Option to ‘edit’ form from landing page editor, clicking ‘edit’ links through to the form editor.
Option to ‘create new’ from this area also, which automatically links this new form to the landing page and updates the form listing ‘appears on’ column automatically
Marketo
Option to click through to form from landing page listing
Eloqua
Dependencies/links modal included to show links between form and containers
...
Status | ||||
---|---|---|---|---|
|
Include shortcuts/quick actions from within campaign to allow quicker navigation from platform sections
Status | ||||
---|---|---|---|---|
|
Status | ||||
---|---|---|---|---|
|
Proposal Feedback:
...
Stakeholder
...
Date
...
Changes
...
Product Team
...
17/06/2019
...
Status | ||||
---|---|---|---|---|
|
Remove form selection from campaign section
Add search filters added on all relevant table columns
Translation buttons added to form listing page
Added 'Create via CSV' button on form listing
Remove all instances of 'form status'
Add 'active/archive' form tabs
Status | ||||
---|---|---|---|---|
|
On 'associate' modal, add column for form URL
This doesn’t make sense to include on the global level, as full form urls will be generated once associated to campaigns and would make sense to surface on campaign level, but form urls (without the campaign id in the url) can still be viewed by clicking ‘view’ on the form listing
Status | ||||
---|---|---|---|---|
|
Status | ||||
---|---|---|---|---|
|
...
Client - Twogether
...
26/08/2020
...
Status | ||||
---|---|---|---|---|
|
Validation - guidance - knock-off effects to changes
Various validation and warning messages and confirmations added throughout process
Campaign specific form - Form Listings
Campaign side of mocks done
1 form set up
Client thought there would only be 1 form per enterprise, so we need to make sure to include relevant tooltips and information and validation where necessary
Forget where I need to make a change notification
From campaign level, there will be a link to go to edit your form directly in form editor so you do not need to go to forms listing and search for the form you’re wanting to edit
Status | ||||
---|---|---|---|---|
|
Alias/form label
This should be done with form naming as is currently done, we won’t be including a separate label column as this can already be achieved in the form name as it is not tied to the form slug
Status | ||||
---|---|---|---|---|
|
Status | ||||
---|---|---|---|---|
|
...
Client - Spiceworks
...
26/08/2020
...
Status | ||||
---|---|---|---|---|
|
Find things by campaign, add more search filters
Added ‘advertiser’ column in associate modal and added filters for searching
table filtering and searching
Already in place
Status | ||||
---|---|---|---|---|
|
Status | ||||
---|---|---|---|---|
|
Status | ||||
---|---|---|---|---|
|
And if it is active/not all campaigns start and end
Add another column onto associate campaign modal to show campaign status?
...
Client - Dennis
...
26/08/2020
...
Status | ||||
---|---|---|---|---|
|
keep form listing
Included in new mocks
Status | ||||
---|---|---|---|---|
|
editing terms - a bigger text area
Not related to this feature
advertiser tcs section - dynamic
Not related to this feature
Status | ||||
---|---|---|---|---|
|
Status | ||||
---|---|---|---|---|
|
...
Client - Intensify
...
26/08/2020
Status | ||||
---|---|---|---|---|
|
advertiser listing
Included within associate campaign modal
list of all campaigns - to show available then add the filter
Done, associate modal now includes columns for campaign and relevant filters
active/inactive view
Done through active form and archive sections
Change from ‘subnavigation’ to ‘tabs’
Status | ||||
---|---|---|---|---|
|
Alias/form label
...
Overview:
Description | Move current form functionality from campaign level to global level. |
---|---|
Mockup | |
Assets | https://drive.google.com/drive/folders/1HW8DIZ5P6llBtmb-ZVmNWLuWd2Eg02be?usp=sharing |
...
Quantitative Data:
Info |
---|
Data driven justification for ux/ui changes, especially necessary for organic changes that do not originate from client requests or roadmap features. |
Link | Date Range | Item | Metric & Value | Assumption | ||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
16/11/2020 | form/edit | Average time on page
|
| |||||||||
16/11/2020 to 22/11/2020 | form/edit | Page views
|
| |||||||||
16/11/2020 to 22/11/2020 | form/list | Average time on page
|
| |||||||||
16/11/2020 to 22/11/2020 | form/list | Page views
|
|
...
Competitor Research:
Function | Findings | Image | Takeaways | ||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Navigation Structure | Hubspot
Marketo
Mailchimp
Eloqua
|
| |||||||||||||||||||
Forms Listing Page | Hubspot
Marketo
Eloqua
|
| |||||||||||||||||||
Form Reporting | Hubspot
|
| |||||||||||||||||||
Form Editing | Hubspot
Marketo
Eloqua
|
| |||||||||||||||||||
Form Actions from Container | Hubspot
Marketo
Eloqua
|
|
...
Proposal Feedback:
Stakeholder | Date | Changes | ||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Product Team | 17/06/2020 |
| ||||||||||||||||||||||||
Client - Twogether | 26/08/2020 |
| ||||||||||||||||||||||||
Client - Spiceworks | 26/08/2020 |
| ||||||||||||||||||||||||
Client - Dennis | 26/08/2020 |
| ||||||||||||||||||||||||
Client - Intensify | 26/08/2020 |
| ||||||||||||||||||||||||
Product Team | 28/09/2020 |
| ||||||||||||||||||||||||
Product Team | 22/10/2020 |
| ||||||||||||||||||||||||
CS/Sales Team | 27/10/2020 |
| ||||||||||||||||||||||||
Client - Dennis | 04/11/2020 |
| ||||||||||||||||||||||||
Product Team |
09/ |
Status | ||||
---|---|---|---|---|
|
‘Associated campaigns’ banner added to top of form builder page
11/2020 |
|
|
It seems weird to me that you have to option to save as an isolated form within the form builder, because I would class this task as ‘form management’ and not ‘form editing’, and I think the management of forms should be done through the form listing with all the other form management tasks and not the editor
If you’re intention from the very beginning was to have an isolated form from within a campaign, you first have to associate a form, click to edit that form, then save as an isolated form, then associate the form to the campaign you were just on, then when you go back to the campaign you end up having 2 forms in the campaign, and if you wanted to be clean and tidy then you’d remove the original form = a lot of steps. The second way (images 14 to 17) is through the ‘isolate selected form’ checkbox on the ‘associate’ dialog. I prefer this journey because:
This particular form management task of creating your isolated form is completed through the form listings where all the other form management happens
| ||||||||||||||||||||||||||
Client - Acquisition Inc | 09/11/2020 |
|
Product Team
Client - Hoburne | 11/11/2020 |
| ||||||
Client - Intensify | 12/11/2020 |
|
Association and removing association should be same as Agency / Advertiser management (search and add style)
Done for campaign association
I still find the Campaign level “edit” a very confusing process. It might be a terminology thing but I think we need to work on making that process clearer or removing it.
I’ll change terminology to ‘manage’ for now, but then if we decide to remove it in the future then we can
I think Translations should also only be on global level - leaving just implementation info and view on the table.
Done for global form listing
Add the ‘active’ and ‘archived’ forms in the mocks
Done and included in mocks
Status | ||||
---|---|---|---|---|
|
Status | ||||
---|---|---|---|---|
|
Status | ||||
---|---|---|---|---|
|
CS/Sales Team
| ||||||||||||||||||||
Client - Incisive | 20/11/2020 |
| ||||||||||||||||||
Product Team | 09/12/2020 |
|
select all on campaign association
Done, added a ‘remove all’ button, again for the scenario where users might want to remove all associations to a form
advertiser column on campaigns association
For the ‘associate form to campaign’ modal (e.g. image #6), advertiser column and column filters added which would make it easier to find associated campaigns for the scenario where a form has hundreds of campaigns associated to it
When deleting signing off on deletion
We already show in the mocks that if you want to delete a form you have to first remove any campaign associations (and if you don’t you’ll get a warning), then you can delete a form (and yet again you get a confirmation modal before you can finally delete). But CS/Sales mentioned that it would be good to have even more validation around deleting forms which I think is fair, it’ll only help reduce mistakes. A suggestion from Sophie was to add the ‘signed by’ input thing that we have when creating forms, but instead use it for confirmation when deleting forms, this is a good idea.
|
| ||||||||||
Product Team | 06/01/2021 |
|
|
Client - Dennis
|
|
Product Team
09/11/2020
|
Active/inactive view
Changed from subnavigation to tabs
Form builder ui changes
Associate, save as new, translate, archive button added within panel header - now serves as form management panel
Associations banner added within ‘setup’ tab
‘Preview’ form button changed to ‘view’ for consistency
‘Enabled’ toggle removed
Delete confirmation
Have to archive form first, then you can delete form from there
Form listing
Save as new button now opens 2 step process
Step 1 - choose new form name and slug
Step 2 - existing campaign associations from original form shown, which can then be edited
‘Enabled’ column removed as we now have archive functionality
Terminology
All instances of clone/duplicate form changed to ‘save as new’ for consistency
All instances of manage form changed to ‘edit’ for consistency
Campaign form listing
Associations to campaign can be done here, but no shortcuts/extra functionality included to automatically duplicate and assign form to current campaign, this has to be managed through the form listing
| ||||||||||||||||||
Product Team | 13/01/2021 | GLOBAL FORMS (MAIN) MOCKS APPROVED | ||||||||||||||||
Product Team | 20/01/2021 |
|
Status | ||||
---|---|---|---|---|
|
Client - Acquisition Inc
| ||||||||||
Product Team | 20/01/2021 | GLOBAL FORMS (DYNAMIC THANKS PAGE) MOCKS APPROVED | ||||||||
Product Team | 03/02/2021 | GLOBAL FORMS (DYNAMIC FORM FIELD) MOCKS APPROVED | ||||||||
Product Team | 08/06/2021 |
|
|
...
Retrospective:
Info |
---|
To be completed after this features release. The retrospective should allow a basis for further improvements to this feature. |
User Feedback
Stakeholder | Date | Description |
---|---|---|
Quantitative Data
Source | Link | Description | Findings |
---|---|---|---|