Wileo
Wileo
Wileo
The platform enables Australian consultants to connect with clients and secure high-quality projects in the rail and renewal engineering market. A key feature is the community aspect, which encourages consultants to sign up by allowing them to engage with other experts and broaden their professional network.
The platform enables Australian consultants to connect with clients and secure high-quality projects in the rail and renewal engineering market. A key feature is the community aspect, which encourages consultants to sign up by allowing them to engage with other experts and broaden their professional network.
The platform enables Australian consultants to connect with clients and secure high-quality projects in the rail and renewal engineering market. A key feature is the community aspect, which encourages consultants to sign up by allowing them to engage with other experts and broaden their professional network.
Client
Client
Wileo Consulting Contract
Wileo Consulting Contract
Services
Services
Value Propositions Competitors Research UX Research UX Modeling Interaction Design User Interface Design User Experience Design
Value Propositions Competitors Research UX Research UX Modeling Interaction Design User Interface Design User Experience Design
Teams
Teams
1 Product Designer 2 Marketers 1 UX Writer 1 Program Manager 4 Developers 2 CEO/Co-Founder
1 Product Designer 2 Marketers 1 UX Writer 1 Program Manager 4 Developers 2 CEO/Co-Founder
Duration
Duration
Nov 2020 - Apr 2021 · 6 mos
Nov 2020 - Apr 2021 · 6 mos
Diving into UX Research
Exploring the Problem Space
My approach started with with immersing myself in the problem space to align business objectives with user needs.
Kick-off Meeting Highlights:
Business Objectives:
Establish Wileo as a premier platform connecting consultants with clients in engineering.Target Audience:
Australian consultants in rail and renewable engineering, and the clients seeking their expertise.Brand Pillars:
Professionalism, quality, and community.Competitive Landscape:
Analyzed platforms like Expert360 to identify opportunities.Key Metrics:
User engagement, project postings, successful matches.
Collaborating on User Research
Partnering with marketer Ivana Trajkovska, we crafted surveys to extract insights from clients and consultants. Sample Survey Questions:
The Survey Blueprint of Consultant and Client
We shared the survey created on Typeform on Linkedin to get more responses.
Analyzing the Data with Affinity Diagrams
We then organized the responses into affinity diagrams to identify patterns and key insights.
Client Feedback Affinity Diagram
Consultant Feedback Affinity Diagram
Defining the Core Issues
Navigating Constraints with Pragmatism
We faced business and technical limitations, notably the decision to use the WordPress theme FreelanceEngine due to budget constraints. This required balancing design priorities with stakeholder decisions.
To overcome this constraints, I focused on creating relevant persona content and adjusting the theme where possible to meet user needs, despite its limitations.
Crafting User Personas
Based on the survey data and affinity diagrams, I created detailed user personas for both clients and consultants. These personas helped keep the design process user-centered.
Client Persona: Represents procurement managers or project leads seeking specialized consultants.
Consultant Persona: Represents experienced engineers looking for quality projects and flexible work arrangements.
Experience Design
Mapping the User Journey
Developing a User Journey Map was essential due to the complexity of involving three distinct actors: the business, consultants, and clients. I combined their journeys into a unified canvas, focusing on:
Interaction Point:
Managing transitions between actors as they complete tasks and hand off the journey to the next actor.Product Considerations:
How Wileo's product handles these interactions.Business Operating Costs:
Addressing the financial efficiency of Wileo’s operations, labeling efforts as Low, Medium, or High.
User Journey Map
Interaction Point
Product and Business Considerations with Labels Representing the Effort and Cost "Low , Medium , Hight"
Developing UX Scenarios
The user journey map provided a broad overview, but to validate specific actions and activities, I developed UX Scenarios for each persona. These scenarios zoomed in on individual experiences, ensuring that the platform met each user's needs effectively.
UX scenarios focused on Consultant and Client journeys to validate actions and activities for each persona.
Value Proposition Canvas
Using the Value Proposition Canvas, we refined our services by aligning them with user pains and gains. This helped in improving both the service and product sides of Wileo.
Consultants: Services like Interview, CV validation and access to quality projects.
Clients: Offerings like evaluating new job posts, team gatherings, and team managing.
The Value Proposition Canvas was created for both clients and consultants to focus on the products and services Wileo offers.
Product Stories Map
We visualized the user's journey from the product perspective using Product Story Maps. This approach helped in writing clear product specifications by defining activities and features for each customer segment.
Product Story Map for Clients
Product Story Map for Consultants
Take a closer look on the documents on FigJam →
Password: lilac-rem-hurry-motto
Ideation
Group Brainstorming
Collaborative brainstorming sessions with stakeholders from development, marketing, and design were crucial. These sessions helped in generating and validating solutions, assessing feasibility, and ensuring that ideas aligned with user needs.
Competitors Research
I worked with marketer Invaka to Investigate competitors like Expert360 provided insights into industry standards and best practices.Despite challenges in accessing some platforms due to the requirements of being Australian and platform acceptance, we:
Watched published training videos.
Analyzed publicly available website content for information on features and functionality
Used Pageflows to capture screenshots and videos, focusing on Expert360, a key competitor.
Wileo Primary and Secondary Competitors
IA and Content Strategy
Sitemap and Userflow
I constructed a hierarchical sitemap to establish the website's overall structure and navigation. Detailed user flows were developed for both the consultant and client systems to map out user journeys comprehensively.
Sitemap and Userflow of Consultant System. Link →
Password: ai-sync-swear-carve
Sitemap and Userflow of Client System. Link →
Password: ai-sync-swear-carve
Content Strategy
The content strategy was primarily focused on the landing pages of the site. To guide the copywriting process, I employed the AIDA model (Attention, Interest, Desire, Action) to create a structured framework. My role included consulting on the content results produced by the copywriters to ensure alignment with our goals.
Content framework was built on Notion for easy collaboration and transparency.
Design
Wireframe
I designed wireframes and presented them as Wireflows to stakeholders. This facilitated prompt feedback and iterative improvements.
Wireframe Design. Link →
Password: ivy-audio-cycle-wise
UI Mockups and Features
The Landing Page
We designed the landing page in two phases.
Phase 1 (2021-2023)
Focus: Raise awareness of Wileo’s transition from services to a product and attract consultants.Features:
Clients understand available services
Applicants can apply for missing capabilities or contact us.
Consultants access timesheets through the workspace dashboard after onboarding.
Contact us to apply for this capability.
Phase 2 (2024)
Focus: Launch the full version, targeting both consultants and clients.Features:
Allowing users to explore current projects, skills, and consultants.
Engaging both clients and consultants with tailored content.
Understand the process after signing up.
A section below the hero header targeting both clients and consultants
How it works like a story between of collaboration between client and consultant
Consultant System
Client System
Shared Features in Both Systems
Both systems share common features with slight variations to maintain a consistent experience for all users while supporting component reusability and minimizing development costs. The common features include:
Access to Community Before Approval
Users can engage with community features while waiting for approval to keep them engaged.
Guides for Writing Project Details and Cover Letters
Included guides next to text areas to help users understand what is needed.
Contextual Actions
Notifications and relevant areas equipped with contextual actions to provide immediate assistance.
Avoidance of Technical Terms
To simplify the language, ensure clear communication, and avoid confusion, we replaced technical jargon and complex terms with commonly known words. For example, the FreelanceEngine WordPress Theme did not clearly differentiate between "projects" and "contracts," so we addressed that issue in our design.
Handing-off
I handed off the projects in two formats:
Share the Design Specs and User Flow to provide detailed guidelines for developers
Design Notes Supported with HTML and CSS offered clear instructions and code snippets to facilitate implementation.
Design Notes Supported with HTML and CSS
What I learned
Product Operation Effort & Cost
By including operational tasks in the user journey map, stakeholders gained a better understanding of the time and costs associated with each user action. This approach led to more strategic decisions that balanced user experience with business efficiency.
Pragmatism
Projects often come with constraints, so flexibility is crucial. In this project, we had to incorporate business elements into the user journey map because the platform (Wileo) controlled certain steps. For example:
While a user journey map typically focuses on users, in this case, it was necessary to incorporate business-related elements. This was because Wileo, the platform, would control certain steps in the journey, shaping the overall experience—a common standard in projects of this nature.
During the define phase, stakeholders opted for a WordPress theme to launch the platform quickly and cost-effectively. The challenge I faced was the constraint of designing within the limitations of this theme.
Focus To Achieve the Best Outcome
Managing complexity involved simplifying the initial user journey map, which became unwieldy, by creating UX scenarios and focusing on specific product features to make the design more manageable. Additionally, aligning with user needs ensured that the final design remained closely aligned with the needs and expectations of our personas.
Be Transparent with Users
Don't assume that users know information they might not be familiar with or make the experience unnecessarily challenging—it's amusing in games, but not suitable for job platforms. Always ensure that all necessary information is clear. For example, we provide users with information about approval criteria in both areas: during the application process and when posting a job or writing a cover letter.
Diving into UX Research
Exploring the Problem Space
My approach started with with immersing myself in the problem space to align business objectives with user needs.
Kick-off Meeting Highlights:
Business Objectives:
Establish Wileo as a premier platform connecting consultants with clients in engineering.Target Audience:
Australian consultants in rail and renewable engineering, and the clients seeking their expertise.Brand Pillars:
Professionalism, quality, and community.Competitive Landscape:
Analyzed platforms like Expert360 to identify opportunities.Key Metrics:
User engagement, project postings, successful matches.
Collaborating on User Research
Partnering with marketer Ivana Trajkovska, we crafted surveys to extract insights from clients and consultants. Sample Survey Questions:
The Survey Blueprint of Consultant and Client
We shared the survey created on Typeform on Linkedin to get more responses.
Analyzing the Data with Affinity Diagrams
We then organized the responses into affinity diagrams to identify patterns and key insights.
Client Feedback Affinity Diagram
Consultant Feedback Affinity Diagram
Defining the Core Issues
Navigating Constraints with Pragmatism
We faced business and technical limitations, notably the decision to use the WordPress theme FreelanceEngine due to budget constraints. This required balancing design priorities with stakeholder decisions.
To overcome this constraints, I focused on creating relevant persona content and adjusting the theme where possible to meet user needs, despite its limitations.
Crafting User Personas
Based on the survey data and affinity diagrams, I created detailed user personas for both clients and consultants. These personas helped keep the design process user-centered.
Client Persona: Represents procurement managers or project leads seeking specialized consultants.
Consultant Persona: Represents experienced engineers looking for quality projects and flexible work arrangements.
Experience Design
Mapping the User Journey
Developing a User Journey Map was essential due to the complexity of involving three distinct actors: the business, consultants, and clients. I combined their journeys into a unified canvas, focusing on:
Interaction Point:
Managing transitions between actors as they complete tasks and hand off the journey to the next actor.Product Considerations:
How Wileo's product handles these interactions.Business Operating Costs:
Addressing the financial efficiency of Wileo’s operations, labeling efforts as Low, Medium, or High.
User Journey Map
Interaction Point
Product and Business Considerations with Labels Representing the Effort and Cost "Low , Medium , Hight"
Developing UX Scenarios
The user journey map provided a broad overview, but to validate specific actions and activities, I developed UX Scenarios for each persona. These scenarios zoomed in on individual experiences, ensuring that the platform met each user's needs effectively.
UX scenarios focused on Consultant and Client journeys to validate actions and activities for each persona.
Value Proposition Canvas
Using the Value Proposition Canvas, we refined our services by aligning them with user pains and gains. This helped in improving both the service and product sides of Wileo.
Consultants: Services like Interview, CV validation and access to quality projects.
Clients: Offerings like evaluating new job posts, team gatherings, and team managing.
The Value Proposition Canvas was created for both clients and consultants to focus on the products and services Wileo offers.
Product Stories Map
We visualized the user's journey from the product perspective using Product Story Maps. This approach helped in writing clear product specifications by defining activities and features for each customer segment.
Product Story Map for Clients
Product Story Map for Consultants
Take a closer look on the documents on FigJam →
Password: lilac-rem-hurry-motto
Ideation
Group Brainstorming
Collaborative brainstorming sessions with stakeholders from development, marketing, and design were crucial. These sessions helped in generating and validating solutions, assessing feasibility, and ensuring that ideas aligned with user needs.
Competitors Research
I worked with marketer Invaka to Investigate competitors like Expert360 provided insights into industry standards and best practices.Despite challenges in accessing some platforms due to the requirements of being Australian and platform acceptance, we:
Watched published training videos.
Analyzed publicly available website content for information on features and functionality
Used Pageflows to capture screenshots and videos, focusing on Expert360, a key competitor.
Wileo Primary and Secondary Competitors
IA and Content Strategy
Sitemap and Userflow
I constructed a hierarchical sitemap to establish the website's overall structure and navigation. Detailed user flows were developed for both the consultant and client systems to map out user journeys comprehensively.
Sitemap and Userflow of Consultant System. Link →
Password: ai-sync-swear-carve
Sitemap and Userflow of Client System. Link →
Password: ai-sync-swear-carve
Content Strategy
The content strategy was primarily focused on the landing pages of the site. To guide the copywriting process, I employed the AIDA model (Attention, Interest, Desire, Action) to create a structured framework. My role included consulting on the content results produced by the copywriters to ensure alignment with our goals.
Content framework was built on Notion for easy collaboration and transparency.
Design
Wireframe
I designed wireframes and presented them as Wireflows to stakeholders. This facilitated prompt feedback and iterative improvements.
Wireframe Design. Link →
Password: ivy-audio-cycle-wise
UI Mockups and Features
The Landing Page
We designed the landing page in two phases.
Phase 1 (2021-2023)
Focus: Raise awareness of Wileo’s transition from services to a product and attract consultants.Features:
Clients understand available services
Applicants can apply for missing capabilities or contact us.
Consultants access timesheets through the workspace dashboard after onboarding.
Contact us to apply for this capability.
Phase 2 (2024)
Focus: Launch the full version, targeting both consultants and clients.Features:
Allowing users to explore current projects, skills, and consultants.
Engaging both clients and consultants with tailored content.
Understand the process after signing up.
A section below the hero header targeting both clients and consultants
How it works like a story between of collaboration between client and consultant
Consultant System
Client System
Shared Features in Both Systems
Both systems share common features with slight variations to maintain a consistent experience for all users while supporting component reusability and minimizing development costs. The common features include:
Access to Community Before Approval
Users can engage with community features while waiting for approval to keep them engaged.
Guides for Writing Project Details and Cover Letters
Included guides next to text areas to help users understand what is needed.
Contextual Actions
Notifications and relevant areas equipped with contextual actions to provide immediate assistance.
Avoidance of Technical Terms
To simplify the language, ensure clear communication, and avoid confusion, we replaced technical jargon and complex terms with commonly known words. For example, the FreelanceEngine WordPress Theme did not clearly differentiate between "projects" and "contracts," so we addressed that issue in our design.
Handing-off
I handed off the projects in two formats:
Share the Design Specs and User Flow to provide detailed guidelines for developers
Design Notes Supported with HTML and CSS offered clear instructions and code snippets to facilitate implementation.
Design Notes Supported with HTML and CSS
What I learned
Product Operation Effort & Cost
By including operational tasks in the user journey map, stakeholders gained a better understanding of the time and costs associated with each user action. This approach led to more strategic decisions that balanced user experience with business efficiency.
Pragmatism
Projects often come with constraints, so flexibility is crucial. In this project, we had to incorporate business elements into the user journey map because the platform (Wileo) controlled certain steps. For example:
While a user journey map typically focuses on users, in this case, it was necessary to incorporate business-related elements. This was because Wileo, the platform, would control certain steps in the journey, shaping the overall experience—a common standard in projects of this nature.
During the define phase, stakeholders opted for a WordPress theme to launch the platform quickly and cost-effectively. The challenge I faced was the constraint of designing within the limitations of this theme.
Focus To Achieve the Best Outcome
Managing complexity involved simplifying the initial user journey map, which became unwieldy, by creating UX scenarios and focusing on specific product features to make the design more manageable. Additionally, aligning with user needs ensured that the final design remained closely aligned with the needs and expectations of our personas.
Be Transparent with Users
Don't assume that users know information they might not be familiar with or make the experience unnecessarily challenging—it's amusing in games, but not suitable for job platforms. Always ensure that all necessary information is clear. For example, we provide users with information about approval criteria in both areas: during the application process and when posting a job or writing a cover letter.