YEAR
YEAR

2019

2019

ROLE

UX Designer

CLIENT

Hostopia

ABOUT CLIENT
ABOUT CLIENT

Hostopia is a leading provider of private label web services and business communication tools that allow service providers to differentiate their core product offerings, drive incremental revenue and build customer retention.

logo – 8@2x
logo – 5@2x
logo – 6@2x
logo – 2@2x
logo – 3@2x
logo – 1@2x
logo – 9@2x
logo – 7@2x
logo – 10@2x
logo – 4@2x
logo – 11@2x
logo – 12@2x
PROBLEM
PROBLEM
PROBLEM

Most customers already have a website. What they asked for was an easy way to market their business online and get in touch with their customers.

The business goal was a value-add product and retention program for new-in customers purchasing core services. 

Most customers already have a website. What they asked for was an easy way to market their business online and get in touch with their customers.

The business goal was a value-add product and retention program for new-in customers purchasing core services. 

Most customers already have a website. What they asked for was an easy way to market their business online and get in touch with their customers.

The business goal was a value-add product and retention program for new-in customers purchasing core services. 

Most customers already have a website. What they asked for was an easy way to market their business online and get in touch with their customers.

The business goal was a value-add product and retention program for new-in customers purchasing core services. 

Most customers already have a website. What they asked for was an easy way to market their business online and get in touch with their customers.

The business goal was a value-add product and retention program for new-in customers purchasing core services. 

Personalize

Personalize

Personalize

Personalize

Personalize

Our partners new-in clients can customize a landing page for their customers. Using a dynamic, interactive, and easy-to-use online webform, customers are guided in creating a beautiful new landing page to use as a marketing tool in a few simple steps. These changes include their marketing goal, colours, fonts, and uploading their logo and imagery to match their brand.

Our partners new-in clients can customize a landing page for their customers. Using a dynamic, interactive, and easy-to-use online webform, customers are guided in creating a beautiful new landing page to use as a marketing tool in a few simple steps. These changes include their marketing goal, colours, fonts, and uploading their logo and imagery to match their brand.

Our partners new-in clients can customize a landing page for their customers. Using a dynamic, interactive, and easy-to-use online webform, customers are guided in creating a beautiful new landing page to use as a marketing tool in a few simple steps. These changes include their marketing goal, colours, fonts, and uploading their logo and imagery to match their brand.

Our partners new-in clients can customize a landing page for their customers. Using a dynamic, interactive, and easy-to-use online webform, customers are guided in creating a beautiful new landing page to use as a marketing tool in a few simple steps. These changes include their marketing goal, colours, fonts, and uploading their logo and imagery to match their brand.

Our partners new-in clients can customize a landing page for their customers. Using a dynamic, interactive, and easy-to-use online webform, customers are guided in creating a beautiful new landing page to use as a marketing tool in a few simple steps. These changes include their marketing goal, colours, fonts, and uploading their logo and imagery to match their brand.

Promote

Promote

Problem

Problem

This goal-driven landing page offers 5 unique marketing goals to promote their business.

1. Updated landing page
2. Share a PDF document (menu)
3. Promote a discount
4. Build your email list
5. Share news. 

Customers complete the online webform and receive an PromoPage landing page for their business. 

This goal-driven landing page offers 5 unique marketing goals to promote their business.

1. Updated landing page
2. Share a PDF document (menu)
3. Promote a discount
4. Build your email list
5. Share news. 

Customers complete the online webform and receive an PromoPage landing page for their business. 

This goal-driven landing page offers 5 unique marketing goals to promote their business.

1. Updated landing page
2. Share a PDF document (menu)
3. Promote a discount
4. Build your email list
5. Share news. 

Customers complete the online webform and receive an PromoPage landing page for their business. 

This goal-driven landing page offers 5 unique marketing goals to promote their business.

1. Updated landing page
2. Share a PDF document (menu)
3. Promote a discount
4. Build your email list
5. Share news. 

Customers complete the online webform and receive an PromoPage landing page for their business. 

This goal-driven landing page offers 5 unique marketing goals to promote their business.

1. Updated landing page
2. Share a PDF document (menu)
3. Promote a discount
4. Build your email list
5. Share news. 

Customers complete the online webform and receive an PromoPage landing page for their business. 

Up-sell

Upsell

Upsell

PromoPages is a customizable templated promotional page that is auto-provisioned for new in customers upon sign up with their service provider. PromoPages are bundled with our partners core services, such as business phone or internet plans, as a value-add and retention program. The customer can then choose to customize their PromoPage through an online webform. By doing so the partner receives an opportunity to upsell other products through their sales channel.

PromoPages is a customizable templated promotional page that is auto-provisioned for new in customers upon sign up with their service provider. PromoPages are bundled with our partners core services, such as business phone or internet plans, as a value-add and retention program. The customer can then choose to customize their PromoPage through an online webform. By doing so the partner receives an opportunity to upsell other products through their sales channel.

PromoPages is a customizable templated promotional page that is auto-provisioned for new in customers upon sign up with their service provider. PromoPages are bundled with our partners core services, such as business phone or internet plans, as a value-add and retention program. The customer can then choose to customize their PromoPage through an online webform. By doing so the partner receives an opportunity to upsell other products through their sales channel.

PromoPages is a customizable templated promotional page that is auto-provisioned for new in customers upon sign up with their service provider. PromoPages are bundled with our partners core services, such as business phone or internet plans, as a value-add and retention program. The customer can then choose to customize their PromoPage through an online webform. By doing so the partner receives an opportunity to upsell other products through their sales channel.

PromoPages is a customizable templated promotional page that is auto-provisioned for new in customers upon sign up with their service provider. PromoPages are bundled with our partners core services, such as business phone or internet plans, as a value-add and retention program. The customer can then choose to customize their PromoPage through an online webform. By doing so the partner receives an opportunity to upsell other products through their sales channel.

Process

Process

Process

Process

1.    Define business goals
2.    Requirements
3.    Competitor analysis
4.    User interviews
5.    Define problem
6.    Wireframes, flows & prototypes
7.    Define functionality
8.    Testing
9.    Iterations

1.    Define business goals
2.    Requirements
3.    Competitor analysis
4.    User interviews
5.    Define problem
6.    Wireframes, flows & prototypes
7.    Define functionality
8.    Testing
9.    Iterations

1.    Define business goals
2.    Requirements
3.    Competitor analysis
4.    User interviews
5.    Define problem
6.    Wireframes, flows & prototypes
7.    Define functionality
8.    Testing
9.    Iterations

1.    Define business goals
2.    Requirements
3.    Competitor analysis
4.    User interviews
5.    Define problem
6.    Wireframes, flows & prototypes
7.    Define functionality
8.    Testing
9.    Iterations

1.    Define business goals
2.    Requirements
3.    Competitor analysis
4.    User interviews
5.    Define problem
6.    Wireframes, flows & prototypes
7.    Define functionality
8.    Testing
9.    Iterations

Research

Research

Research

Through preliminary research, competitor analysis and user interviews we wanted to determine user goals and pain points. After creating the first prototypes we utilized www.usertesting.com to understand user’s impressions, ease-of-use, and any further pain points for future iterations. As users went through the flow their screens, interactions and audio were recorded. They were given tasks to complete and were prompted to answer pre-determined questions. The results showed that overall, younger demographics found the webform very easy to use but older demographics ran into accessibility issues. We made iterations to increase usability and determined KPI’s to track our products success.

Through preliminary research, competitor analysis and user interviews we wanted to determine user goals and pain points. After creating the first prototypes we utilized www.usertesting.com to understand user’s impressions, ease-of-use, and any further pain points for future iterations. As users went through the flow their screens, interactions and audio were recorded. They were given tasks to complete and were prompted to answer pre-determined questions. The results showed that overall, younger demographics found the webform very easy to use but older demographics ran into accessibility issues. We made iterations to increase usability and determined KPI’s to track our products success.

Through preliminary research, competitor analysis and user interviews we wanted to determine user goals and pain points. After creating the first prototypes we utilized www.usertesting.com to understand user’s impressions, ease-of-use, and any further pain points for future iterations. As users went through the flow their screens, interactions and audio were recorded. They were given tasks to complete and were prompted to answer pre-determined questions. The results showed that overall, younger demographics found the webform very easy to use but older demographics ran into accessibility issues. We made iterations to increase usability and determined KPI’s to track our products success.

Through preliminary research, competitor analysis and user interviews we wanted to determine user goals and pain points. After creating the first prototypes we utilized www.usertesting.com to understand user’s impressions, ease-of-use, and any further pain points for future iterations. As users went through the flow their screens, interactions and audio were recorded. They were given tasks to complete and were prompted to answer pre-determined questions. The results showed that overall, younger demographics found the webform very easy to use but older demographics ran into accessibility issues. We made iterations to increase usability and determined KPI’s to track our products success.

Through preliminary research, competitor analysis and user interviews we wanted to determine user goals and pain points. After creating the first prototypes we utilized www.usertesting.com to understand user’s impressions, ease-of-use, and any further pain points for future iterations. As users went through the flow their screens, interactions and audio were recorded. They were given tasks to complete and were prompted to answer pre-determined questions. The results showed that overall, younger demographics found the webform very easy to use but older demographics ran into accessibility issues. We made iterations to increase usability and determined KPI’s to track our products success.

3
1
Photo on 2018-05-31 at 3.04 PM #2
Test 1 – 5

Challenges

Challenges

Challenges

1.     Accessibility
2.     Many stakeholders
3.     Large demographic
4.     Simplicity and ease of use
5.     White-label turn key ready

1.     Accessibility
2.     Many stakeholders
3.     Large demographic
4.     Simplicity and ease of use
5.     White-label turn key ready

1.     Accessibility
2.     Many stakeholders
3.     Large demographic
4.     Simplicity and ease of use
5.     White-label turn key ready

1.     Accessibility
2.     Many stakeholders
3.     Large demographic
4.     Simplicity and ease of use
5.     White-label turn key ready

1.     Accessibility
2.     Many stakeholders
3.     Large demographic
4.     Simplicity and ease of use
5.     White-label turn key ready

Solution

Solution

Solution

A value-add product and retention program for new-in customers purchasing core services.
 
Small business customer: Upon sign up with their service provider, new-in customers receive an auto provisioned customizable templated promotional page called a PromoPage. By following a link, they open a dynamic webform and complete a few simple steps to receive a beautiful new PromoPage that they can use for their business.
 
Service provider partner: PromoPages are bundled with our telecommunciations partners core services, such as business phone or internet plans, as a value-add and retention program. The customer can then choose to customize their PromoPage through an online webform. By doing so the partner receives an opportunity to upsell other products through their sales channel.

A value-add product and retention program for new-in customers purchasing core services.
 
Small business customer: Upon sign up with their service provider, new-in customers receive an auto provisioned customizable templated promotional page called a PromoPage. By following a link, they open a dynamic webform and complete a few simple steps to receive a beautiful new PromoPage that they can use for their business.
 
Service provider partner: PromoPages are bundled with our telecommunciations partners core services, such as business phone or internet plans, as a value-add and retention program. The customer can then choose to customize their PromoPage through an online webform. By doing so the partner receives an opportunity to upsell other products through their sales channel.

A value-add product and retention program for new-in customers purchasing core services.
 
Small business customer: Upon sign up with their service provider, new-in customers receive an auto provisioned customizable templated promotional page called a PromoPage. By following a link, they open a dynamic webform and complete a few simple steps to receive a beautiful new PromoPage that they can use for their business.
 
Service provider partner: PromoPages are bundled with our telecommunciations partners core services, such as business phone or internet plans, as a value-add and retention program. The customer can then choose to customize their PromoPage through an online webform. By doing so the partner receives an opportunity to upsell other products through their sales channel.

A value-add product and retention program for new-in customers purchasing core services.
 
Small business customer: Upon sign up with their service provider, new-in customers receive an auto provisioned customizable templated promotional page called a PromoPage. By following a link, they open a dynamic webform and complete a few simple steps to receive a beautiful new PromoPage that they can use for their business.
 
Service provider partner: PromoPages are bundled with our telecommunciations partners core services, such as business phone or internet plans, as a value-add and retention program. The customer can then choose to customize their PromoPage through an online webform. By doing so the partner receives an opportunity to upsell other products through their sales channel.

A value-add product and retention program for new-in customers purchasing core services.
 
Small business customer: Upon sign up with their service provider, new-in customers receive an auto provisioned customizable templated promotional page called a PromoPage. By following a link, they open a dynamic webform and complete a few simple steps to receive a beautiful new PromoPage that they can use for their business.
 
Service provider partner: PromoPages are bundled with our telecommunciations partners core services, such as business phone or internet plans, as a value-add and retention program. The customer can then choose to customize their PromoPage through an online webform. By doing so the partner receives an opportunity to upsell other products through their sales channel.

Header image 4

Next Steps

Next Steps

Next Steps

1.     Tracking KPI's
2.     Testing
3.     Iterations

1.     Tracking KPI's
2.     Testing
3.     Iterations

1.     Tracking KPI's
2.     Testing
3.     Iterations

1.     Tracking KPI's
2.     Testing
3.     Iterations

1.     Tracking KPI's
2.     Testing
3.     Iterations

Learnings

Learnings

Learnings

Collaborate closely with developers
Know what will work and what won’t, means that you must work closely with your developers. A change that may seem simple to me, may have a catastrophic ripple effect, or simply take too much time resulting in us missing deadlines. They will have helpful tips and possible solutions with new perspective that will ultimately result in a better product.

Accessibility for all age demographics
The initial iteration of this product worked great for the younger demographic, but once we tested the older demographic, we noticed a lot of visual accessibly issues arising. Quickly we realized some components features, like contrast, were too low and we had to address them to appeal to our wider audience of users.
 
Wide demographic and white label equals super simplified design
Hostopia‘s partners and their users trickle down to the widest possible demographic. We discovered that keeping our product as simple, clean and as straightforward as possible was the way to go for the best user experience.

Collaborate closely with developers
Know what will work and what won’t, means that you must work closely with your developers. A change that may seem simple to me, may have a catastrophic ripple effect, or simply take too much time resulting in us missing deadlines. They will have helpful tips and possible solutions with new perspective that will ultimately result in a better product.

Accessibility for all age demographics
The initial iteration of this product worked great for the younger demographic, but once we tested the older demographic, we noticed a lot of visual accessibly issues arising. Quickly we realized some components features, like contrast, were too low and we had to address them to appeal to our wider audience of users.
 
Wide demographic and white label equals super simplified design
Hostopia‘s partners and their users trickle down to the widest possible demographic. We discovered that keeping our product as simple, clean and as straightforward as possible was the way to go for the best user experience.

Collaborate closely with developers
Know what will work and what won’t, means that you must work closely with your developers. A change that may seem simple to me, may have a catastrophic ripple effect, or simply take too much time resulting in us missing deadlines. They will have helpful tips and possible solutions with new perspective that will ultimately result in a better product.

Accessibility for all age demographics
The initial iteration of this product worked great for the younger demographic, but once we tested the older demographic, we noticed a lot of visual accessibly issues arising. Quickly we realized some components features, like contrast, were too low and we had to address them to appeal to our wider audience of users.
 
Wide demographic and white label equals super simplified design
Hostopia‘s partners and their users trickle down to the widest possible demographic. We discovered that keeping our product as simple, clean and as straightforward as possible was the way to go for the best user experience.

Collaborate closely with developers
Know what will work and what won’t, means that you must work closely with your developers. A change that may seem simple to me, may have a catastrophic ripple effect, or simply take too much time resulting in us missing deadlines. They will have helpful tips and possible solutions with new perspective that will ultimately result in a better product.

Accessibility for all age demographics
The initial iteration of this product worked great for the younger demographic, but once we tested the older demographic, we noticed a lot of visual accessibly issues arising. Quickly we realized some components features, like contrast, were too low and we had to address them to appeal to our wider audience of users.
 
Wide demographic and white label equals super simplified design
Hostopia‘s partners and their users trickle down to the widest possible demographic. We discovered that keeping our product as simple, clean and as straightforward as possible was the way to go for the best user experience.

Collaborate closely with developers
Know what will work and what won’t, means that you must work closely with your developers. A change that may seem simple to me, may have a catastrophic ripple effect, or simply take too much time resulting in us missing deadlines. They will have helpful tips and possible solutions with new perspective that will ultimately result in a better product.

Accessibility for all age demographics
The initial iteration of this product worked great for the younger demographic, but once we tested the older demographic, we noticed a lot of visual accessibly issues arising. Quickly we realized some components features, like contrast, were too low and we had to address them to appeal to our wider audience of users.
 
Wide demographic and white label equals super simplified design
Hostopia‘s partners and their users trickle down to the widest possible demographic. We discovered that keeping our product as simple, clean and as straightforward as possible was the way to go for the best user experience.

YEAR

2019

ROLE

UX Designer

CLIENT

Hostopia

ABOUT CLIENT

Hostopia is a leading provider of private label web services and business communication tools that allow service providers to differentiate their core product offerings, drive incremental revenue and build customer retention.

More Work

Clear SignUX | WEB APP

BGRS DashboardUX | DASHBOARD

PromoPagesPromoPages Campaign

Vertical AdvisorUX | Product | Marketing