Bringing delight to aspiring students
Client
Tio Business School
Role
Visual/UX Designer
Industry
Education · Business
Timeline
2022 · 6 mos
Tio is a small and personal business school. As part of their rebranding, I was responsible for iterating and delivering on almost everything besides the brand; from first wireframes and information architecture to final visual designs and micro-animations. Going beyond just a website redesign by implementing a matchmaker, dynamic content, and a springboard tool to elevate their online brand presence.
Bringing delight to aspiring students
Client
Tio Business School
Role
Visual/UX Designer
Industry
Education · Business
Timeline
2022 · 6 mos
Tio is a small and personal business school. As part of their rebranding, I was responsible for iterating and delivering on almost everything besides the brand; from first wireframes and information architecture to final visual designs and micro-animations. Going beyond just a website redesign by implementing a matchmaker, dynamic content, and a springboard tool to elevate their online brand presence.
Bringing delight to aspiring students
Client
Tio Business School
Role
Visual/UX Designer
Industry
Education · Business
Timeline
2022 · 6 mos
Tio is a small and personal business school. As part of their rebranding, I was responsible for iterating and delivering on almost everything besides the brand; from first wireframes and information architecture to final visual designs and micro-animations. Going beyond just a website redesign by implementing a matchmaker, dynamic content, and a springboard tool to elevate their online brand presence.
A brief history of Tio
Tio is a private business school founded in 1969 offering bachelor programmes in hospitality, tourism and business. They believe in small classrooms, personal attention, and empowering students. The Higher Education Guide rated Tio the Best University of Applied Sciences (small size) in the Netherlands. In addition, Tio received awards & recognition for the most highly rated hotel school and bachelor's degrees in tourism, business administration and marketing.
A brief history of Tio
Tio is a private business school founded in 1969 offering bachelor programmes in hospitality, tourism and business. They believe in small classrooms, personal attention, and empowering students. The Higher Education Guide rated Tio the Best University of Applied Sciences (small size) in the Netherlands. In addition, Tio received awards & recognition for the most highly rated hotel school and bachelor's degrees in tourism, business administration and marketing.
A brief history of Tio
Tio is a private business school founded in 1969 offering bachelor programmes in hospitality, tourism and business. They believe in small classrooms, personal attention, and empowering students. The Higher Education Guide rated Tio the Best University of Applied Sciences (small size) in the Netherlands. In addition, Tio received awards & recognition for the most highly rated hotel school and bachelor's degrees in tourism, business administration and marketing.
Rough customer journey map of current situation
Rough customer journey map of current situation
Rough customer journey map of current situation
Mapping the current state
In order to understand current processes, expert reviews and analysis of existing reports helped formulate the right questions to setup a rough customer journey. Which things do we want to improve about the web experience? Which needs do aspiring students have who approach Tio? How might we better inform and advice them? The rough journey helped underline user jobs, pains, gains, and recommendations to form a starting point for the early concepts and demo’s.
Mapping the current state
In order to understand current processes, expert reviews and analysis of existing reports helped formulate the right questions to setup a rough customer journey. Which things do we want to improve about the web experience? Which needs do aspiring students have who approach Tio? How might we better inform and advice them? The rough journey helped underline user jobs, pains, gains, and recommendations to form a starting point for the early concepts and demo’s.
Mapping the current state
In order to understand current processes, expert reviews and analysis of existing reports helped formulate the right questions to setup a rough customer journey. Which things do we want to improve about the web experience? Which needs do aspiring students have who approach Tio? How might we better inform and advice them? The rough journey helped underline user jobs, pains, gains, and recommendations to form a starting point for the early concepts and demo’s.
Early-stage sketches, image-traced and clustered
Early-stage sketches, image-traced and clustered
Early-stage sketches, image-traced and clustered
Ideating through sketching
A high quantity of ideas results in high quality of idea. By making ideas tangible early and rapidly, I contributed to the decision-making process. Before synthesising to a client-facing deck, I used this moment to check-in with my creative director regarding the strategic direction of the project. Through collaboration with brand designers, we translated the essence of the brand and underlying ideas from an emotional perspective to functional UX concepts.
Ideating through sketching
A high quantity of ideas results in high quality of idea. By making ideas tangible early and rapidly, I contributed to the decision-making process. Before synthesising to a client-facing deck, I used this moment to check-in with my creative director regarding the strategic direction of the project. Through collaboration with brand designers, we translated the essence of the brand and underlying ideas from an emotional perspective to functional UX concepts.
Ideating through sketching
A high quantity of ideas results in high quality of idea. By making ideas tangible early and rapidly, I contributed to the decision-making process. Before synthesising to a client-facing deck, I used this moment to check-in with my creative director regarding the strategic direction of the project. Through collaboration with brand designers, we translated the essence of the brand and underlying ideas from an emotional perspective to functional UX concepts.
Service concept proposal for landing page structure
Service concept proposal for landing page structure
Service concept proposal for landing page structure
Defining the service concept
How do we serve the end user? By converging the agreed upon concepts with existing content to a first mental modal; proposing segmentation of landing pages based on predetermined stages in the customer journey. Providing Tio’s products & services through journey-based content specified on and their user jobs, actions, and content. This model also encourages Tio to more actively rationalise about their positioning from a user’s perspective.
Defining the service concept
How do we serve the end user? By converging the agreed upon concepts with existing content to a first mental modal; proposing segmentation of landing pages based on predetermined stages in the customer journey. Providing Tio’s products & services through journey-based content specified on and their user jobs, actions, and content. This model also encourages Tio to more actively rationalise about their positioning from a user’s perspective.
Defining the service concept
How do we serve the end user? By converging the agreed upon concepts with existing content to a first mental modal; proposing segmentation of landing pages based on predetermined stages in the customer journey. Providing Tio’s products & services through journey-based content specified on and their user jobs, actions, and content. This model also encourages Tio to more actively rationalise about their positioning from a user’s perspective.
Wireframe explorations for key templates and patterns
Wireframe explorations for key templates and patterns
Wireframe explorations for key templates and patterns
Iterating on interface design
After collecting more input from Tio and the team, I started wireframing probable solutions directions for core parts of the website like navigation, page templates, and tooling. By showcasing different features, discussions arose and design decisions were made i.e. make components more prominent or completely remove them. Facilitating this rapid desicion making process allowed for high pace towards final versions, developer handoff and design execution.
Iterating on interface design
After collecting more input from Tio and the team, I started wireframing probable solutions directions for core parts of the website like navigation, page templates, and tooling. By showcasing different features, discussions arose and design decisions were made i.e. make components more prominent or completely remove them. Facilitating this rapid desicion making process allowed for high pace towards final versions, developer handoff and design execution.
Iterating on interface design
After collecting more input from Tio and the team, I started wireframing probable solutions directions for core parts of the website like navigation, page templates, and tooling. By showcasing different features, discussions arose and design decisions were made i.e. make components more prominent or completely remove them. Facilitating this rapid desicion making process allowed for high pace towards final versions, developer handoff and design execution.
Springboard (springplank) to provide personal content
Springboard (springplank) to provide personal content
Springboard (springplank) to provide personal content
Retrieving students’ input
To help guide decisions and provide content accordingly we first need to know who we are talking with. A brief dynamic survey retrieves data regarding their current education, what they’re looking for, and additional preferences. This information allows to better provide need-based solutions and help aspiring students make a well-considered choice for a bachelor's degree programme.
Retrieving students’ input
To help guide decisions and provide content accordingly we first need to know who we are talking with. A brief dynamic survey retrieves data regarding their current education, what they’re looking for, and additional preferences. This information allows to better provide need-based solutions and help aspiring students make a well-considered choice for a bachelor's degree programme.
Retrieving students’ input
To help guide decisions and provide content accordingly we first need to know who we are talking with. A brief dynamic survey retrieves data regarding their current education, what they’re looking for, and additional preferences. This information allows to better provide need-based solutions and help aspiring students make a well-considered choice for a bachelor's degree programme.
Landing page with and dynamic tools and content
Landing page with and dynamic tools and content
Landing page with and dynamic tools and content
Guiding in every situation
After the user filled in the survey, we have a better understanding of where they currently stand in their decision-making process, and how Tio might service them. A tailor-made offering is provided by layering dynamic content, actions (i.e. tools, study guides, visiting days, and others), and additional information (e.g. event details, requirements, fees, etc.).
Guiding in every situation
After the user filled in the survey, we have a better understanding of where they currently stand in their decision-making process, and how Tio might service them. A tailor-made offering is provided by layering dynamic content, actions (i.e. tools, study guides, visiting days, and others), and additional information (e.g. event details, requirements, fees, etc.).
Guiding in every situation
After the user filled in the survey, we have a better understanding of where they currently stand in their decision-making process, and how Tio might service them. A tailor-made offering is provided by layering dynamic content, actions (i.e. tools, study guides, visiting days, and others), and additional information (e.g. event details, requirements, fees, etc.).
Collection of final mobile mockups
Collection of final mobile mockups
Collection of final mobile mockups
Learnings
What I’ve learned is the value of lean UX methods in short timespans. Clutch approaches small to medium scale websites and rebranding projects in boosts. Resulting in clear, tangible results within a month or two. For this project, an intense level of collaboration and iteration with both the client and brand designers resulted in the polished UX concepts and next steps for Tio to become more student-centred through their channels
Learnings
What I’ve learned is the value of lean UX methods in short timespans. Clutch approaches small to medium scale websites and rebranding projects in boosts. Resulting in clear, tangible results within a month or two. For this project, an intense level of collaboration and iteration with both the client and brand designers resulted in the polished UX concepts and next steps for Tio to become more student-centred through their channels
Learnings
What I’ve learned is the value of lean UX methods in short timespans. Clutch approaches small to medium scale websites and rebranding projects in boosts. Resulting in clear, tangible results within a month or two. For this project, an intense level of collaboration and iteration with both the client and brand designers resulted in the polished UX concepts and next steps for Tio to become more student-centred through their channels
Credits
Credits
Credits
Remy Lammers – Creative Director • Maxim Pashchenko – Brand Lead • Laura Van Steveninck – Brand Designer • Sjoerd Klatser – Brand Designer • Lauren Maxwell – Story Designer
More work
More work
More work
