Introduction
Introduction
Introduction
Overview
Overview
Overview
In this project, I will showcase a new WWF app, with aim of allowing users to manage adoption records & updates on the go, while also allowing users to adopt new animals more easily. This app also reduces the environmental cost of delivering adoption updates, and makes viewing and storing historical adoption records a breeze.
In this project, I will showcase a new WWF app, with aim of allowing users to manage adoption records & updates on the go, while also allowing users to adopt new animals more easily. This app also reduces the environmental cost of delivering adoption updates, and makes viewing and storing historical adoption records a breeze.
In this project, I will showcase a new WWF app, with aim of allowing users to manage adoption records & updates on the go, while also allowing users to adopt new animals more easily. This app also reduces the environmental cost of delivering adoption updates, and makes viewing and storing historical adoption records a breeze.
Summary
Summary
Summary
A Quick Rundown
A Quick Rundown
A Quick Rundown
The app I have designed includes a records tab, allowing users to easily view new and historical adoption records. This helps reduce the environmental cost of delivering adoption updates, and a dedicated user home page allows for on the go management of current adoptions. To create an all-purpose app, I have also added an e-commerce side to the app, allowing for new adoptions, donations and memberships to be bought.
Throughout the project, I kept in mind the current WWF website, making sure that the app was in keeping with the themes, messages and feeling of the original, ensuring colours and typography are consistent across both.
The app I have designed includes a records tab, allowing users to easily view new and historical adoption records. This helps reduce the environmental cost of delivering adoption updates, and a dedicated user home page allows for on the go management of current adoptions. To create an all-purpose app, I have also added an e-commerce side to the app, allowing for new adoptions, donations and memberships to be bought.
Throughout the project, I kept in mind the current WWF website, making sure that the app was in keeping with the themes, messages and feeling of the original, ensuring colours and typography are consistent across both.
The app I have designed includes a records tab, allowing users to easily view new and historical adoption records. This helps reduce the environmental cost of delivering adoption updates, and a dedicated user home page allows for on the go management of current adoptions. To create an all-purpose app, I have also added an e-commerce side to the app, allowing for new adoptions, donations and memberships to be bought.
Throughout the project, I kept in mind the current WWF website, making sure that the app was in keeping with the themes, messages and feeling of the original, ensuring colours and typography are consistent across both.
Problems
Problems
Problems
No back-up of adoption updates, reports & information in case you would like to view them again in future.
No back-up of adoption updates, reports & information in case you would like to view them again in future.
No back-up of adoption updates, reports & information in case you would like to view them again in future.
Sending every report via post is harmful to the environment contradicting some of WWF's policies.
Sending every report via post is harmful to the environment contradicting some of WWF's policies.
Sending every report via post is harmful to the environment contradicting some of WWF's policies.
Cannot manage your adoptions or buy new adoptions quickly. Currently have to use the WWF website.
Cannot manage your adoptions or buy new adoptions quickly. Currently have to use the WWF website.
Cannot manage your adoptions or buy new adoptions quickly. Currently have to use the WWF website.
Goals
Goals
Goals
Allow report and updates to be easily accessed and read digitally.
Allow report and updates to be easily accessed and read digitally.
Allow report and updates to be easily accessed and read digitally.
Balance update delivery method to avoid alienating users who are less tech literate.
Balance update delivery method to avoid alienating users who are less tech literate.
Balance update delivery method to avoid alienating users who are less tech literate.
Reduce pollution from postage.
Reduce pollution from postage.
Reduce pollution from postage.
Improve ecommerce to allow for on-the-go adoption management and purchases.
Improve ecommerce to allow for on-the-go adoption management and purchases.
Improve ecommerce to allow for on-the-go adoption management and purchases.
Results
Results
Results
The records tab allows for easy access to all updates while on-the-go, filtered by searching or by the animal type.
The records tab allows for easy access to all updates while on-the-go, filtered by searching or by the animal type.
The records tab allows for easy access to all updates while on-the-go, filtered by searching or by the animal type.
PDF updates reduce postage pollution while larger physical updates keep everyone in the loop.
PDF updates reduce postage pollution while larger physical updates keep everyone in the loop.
PDF updates reduce postage pollution while larger physical updates keep everyone in the loop.
Added an ecommerce tab that allows the user to adopt an animal or donate.
Added an ecommerce tab that allows the user to adopt an animal or donate.
Added an ecommerce tab that allows the user to adopt an animal or donate.
User Research
User Research
User Research
Making A Difference
Making A Difference
Making A Difference
Speaking to employees at Natural England, some of whom had adopted animals through WWF, I asked about their opinions on WWF, their experiences adopting an animal and if they had any frustrations with the process or updates they've received since. This led to the following problem statement:
Speaking to employees at Natural England, some of whom had adopted animals through WWF, I asked about their opinions on WWF, their experiences adopting an animal and if they had any frustrations with the process or updates they've received since. This led to the following problem statement:
Speaking to employees at Natural England, some of whom had adopted animals through WWF, I asked about their opinions on WWF, their experiences adopting an animal and if they had any frustrations with the process or updates they've received since. This led to the following problem statement:
People adopting animals through WWF need a more environmentally friendly way of viewing reports and updates, as the current method has no backup of old documents, and delivery is damaging to the environment, clashing with WWF's values.
People adopting animals through WWF need a more environmentally friendly way of viewing reports and updates, as the current method has no backup of old documents, and delivery is damaging to the environment, clashing with WWF's values.
People adopting via WWF need an environmentally friendly way to view updates, as delivery is damaging to the environment, clashing with WWF's values. There is also no backup of old documents.
1 year of penguin adoption WWF reports
1 year of penguin adoption reports
1 year of penguin adoption reports
Brainstorming
Brainstorming
Brainstorming
Interview sentiment suggested a WWF app would be perfect for allowing users to easily view updates digitally, reducing the environmental impact of postage and also make updates available on the go. This would also provide users with a digital archive of their past updates.
To retain the excitement of receiving physical updates, I suggested that the large quarterly updates be kept physical, while smaller, more frequent updates can be delivered via the app.
Interview sentiment suggested a WWF app would be perfect for allowing users to easily view updates digitally, reducing the environmental impact of postage and also make updates available on the go. This would also provide users with a digital archive of their past updates.
To retain the excitement of receiving physical updates, I suggested that the large quarterly updates be kept physical, while smaller, more frequent updates can be delivered via the app.
Interview sentiment suggested a WWF app would be perfect for allowing users to easily view updates digitally, reducing the environmental impact of postage and also make updates available on the go. This would also provide users with a digital archive of their past updates.
To retain the excitement of receiving physical updates, I suggested that the large quarterly updates be kept physical, while smaller, more frequent updates can be delivered via the app.
Goals
Goals
#1
#1
#1
Allow new adoption updates and reports to be easily read and accessed
Allow new adoption updates and reports to be easily read and accessed
Allow new adoption updates and reports to be easily read and accessed
This app will be the replacement viewing method for small adoption updates so each update must be easy to read and manage, otherwise users will be frustrated that they cannot access and view the reports they could once read easily.
This app will be the replacement viewing method for small adoption updates so each update must be easy to read and manage, otherwise users will be frustrated that they cannot access and view the reports they could once read easily.
This app will be the replacement viewing method for small adoption updates so each update must be easy to read and manage, otherwise users will be frustrated that they cannot access and view the reports they could once read easily.
#2
#2
#2
Allow old adoption updates and reports to be viewed
Allow old adoption updates and reports to be viewed
Allow old adoption updates and reports to be viewed
A big problem mentioned in the interviews was that for paper updates, once an update has been read it usually gets recycled and so cannot be read at a later date. The app should not have this problem as there is no paper to store.
A big problem mentioned in the interviews was that for paper updates, once an update has been read it usually gets recycled and so cannot be read at a later date. The app should not have this problem as there is no paper to store.
A big problem mentioned in the interviews was that for paper updates, once an update has been read it usually gets recycled and so cannot be read at a later date. The app should not have this problem as there is no paper to store.
#3
#3
#3
Allow further adoptions through the app
Allow further adoptions through the app
Allow further adoptions through the app
As well as managing existing adoptions in the app, user's may want to adopt another animal all in the same place. This will allow for a more seemless experience, rather than having to go back to the website each time a user wants to adopt another animal.
As well as managing existing adoptions in the app, user's may want to adopt another animal all in the same place. This will allow for a more seemless experience, rather than having to go back to the website each time a user wants to adopt another animal.
As well as managing existing adoptions in the app, user's may want to adopt another animal all in the same place. This will allow for a more seemless experience, rather than having to go back to the website each time a user wants to adopt another animal.
Ideation
Ideation
Ideation
The Roots of the App
The Roots of the App
The Roots of the App
I started to come up with ideas for how each goal could be met within the app. I discussed and gained feedback on these ideas with everyone originally interviewed to ensure my ideas were doing enough to meet the goals set.
I started to come up with ideas for how each goal could be met within the app. I discussed and gained feedback on these ideas with everyone originally interviewed to ensure my ideas were doing enough to meet the goals set.
I started to come up with ideas for how each goal could be met within the app. I discussed and gained feedback on these ideas with everyone originally interviewed to ensure my ideas were doing enough to meet the goals set.
Feature One
Feature One
Feature One
In-app adoption updates
In-app adoption updates
In-app adoption updates
Users want to be able to view new and old updates while on-the-go and without storing endless paperwork. Receiving updates within the app tackles both of these issues.
Users want to be able to view new and old updates while on-the-go and without storing endless paperwork. Receiving updates within the app tackles both of these issues.
Users want to be able to view new and old updates while on-the-go and without storing endless paperwork. Receiving updates within the app tackles both of these issues.
Implementation
Implementation
Implementation One
A 'Records' tab
A 'Records' tab
A 'Records' tab
This tab will store every update and record for each adoption. To navigate, the user can scroll, or the records should be able to be searched by title or filtered by the animal type.
This tab will store every update and record for each adoption. To navigate, the user can scroll, or the records should be able to be searched by title or filtered by the animal type.
This tab will store every update and record for each adoption. To navigate, the user can scroll, or the records should be able to be searched by title or filtered by the animal type.
Feature Two
Feature Two
Feature Two
E-commerce: In-app adoption
E-commerce: In-app adoption
E-commerce: In-app adoption
Users want to be able to view new and old updates while on-the-go and without storing endless paperwork. Receiving updates within the app tackles both of these issues.
Users want to be able to view new and old updates while on-the-go and without storing endless paperwork. Receiving updates within the app tackles both of these issues.
Users want to be able to view new and old updates while on-the-go and without storing endless paperwork. Receiving updates within the app tackles both of these issues.
Implementation
Implementation
Implementation
An E-Commerce tab
An E-Commerce tab
An E-Commerce tab
This tab will act as a one-stop shop for any adoptions, donations or additional purchases that are offered by WWF. It is important to stay consistant with the WWF website to provide familiarity to the users.
This tab will act as a one-stop shop for any adoptions, donations or additional purchases that are offered by WWF. It is important to stay consistant with the WWF website to provide familiarity to the users.
This tab will act as a one-stop shop for any adoptions, donations or additional purchases that are offered by WWF. It is important to stay consistant with the WWF website to provide familiarity to the users.
Sitemap
Sitemap
Sitemap
Since I will be designing the app from scratch, I decided to create a sitemap to visualise how each section of the app pieces together, and get an overall feeling for the app's feature heirarchy. The main focus of the sitemap is on the records page and the shopping page, as these are related to the goals of this project. As such the other areas have been reduced for clarity.
Since I will be designing the app from scratch, I decided to create a sitemap to visualise how each section of the app pieces together, and get an overall feeling for the app's feature heirarchy. The main focus of the sitemap is on the records page and the shopping page, as these are related to the goals of this project. As such the other areas have been reduced for clarity.
Since I will be designing the app from scratch, I decided to create a sitemap to visualise how each section of the app pieces together, and get an overall feeling for the app's feature heirarchy. The main focus of the sitemap is on the records page and the shopping page, as these are related to the goals of this project. As such the other areas have been reduced for clarity.
Sitemap: For the Shopping and Records pages of the app.
Sitemap: For the Shopping and Records pages of the app.
Sitemap: For the Shopping and Records pages of the app.
Style Guide & Design System
Style Guide & Design System
Style Guide & Design System
Alongside the sitemap, I also recreated WWF's existing style guide and created a design system that the app would be based off. This uses the already established themes, fonts and colours the WWF website currently uses, while adapting the sizing and typography to fit an app.
Alongside the sitemap, I also recreated WWF's existing style guide and created a design system that the app would be based off. This uses the already established themes, fonts and colours the WWF website currently uses, while adapting the sizing and typography to fit an app.
Alongside the sitemap, I also recreated WWF's existing style guide and created a design system that the app would be based off. This uses the already established themes, fonts and colours the WWF website currently uses, while adapting the sizing and typography to fit an app.
Design
Design
Design
The WWF App
The WWF App
The WWF App
Throughout the design phase, I conducted regular user testing, where I would present my work and discuss my ideas and designs in relation to the user pain points and the goals.
Throughout the design phase, I conducted regular user testing, where I would present my work and discuss my ideas and designs in relation to the user pain points and the goals.
Throughout the design phase, I conducted regular user testing, where I would present my work and discuss my ideas and designs in relation to the user pain points and the goals.
Record Management
and Viewer
Record Management
and Viewer
Record Management
and Viewer
Provides on-the-go interaction with your adoption records while reducing the environmental impact of physical copies.
Provides on-the-go interaction with your adoption records while reducing the environmental impact of physical copies.
Provides on-the-go interaction with your adoption records while reducing the environmental impact of physical copies.
Design
Design
Design
I chose to opt for a simple list design to manage adoption records, utilising the search, tags and filter options to help aid navigation.
I chose to opt for a simple list design to manage adoption records, utilising the search, tags and filter options to help aid navigation.
I chose to opt for a simple list design to manage adoption records, utilising the search, tags and filter options to help aid navigation.
UX Psychology
UX Psychology
UX Psychology
Miller's Law: Only displaying between 4 and 5 groups relating to a record at a time helps with memory and processing.
Miller's Law: Only displaying between 4 and 5 groups relating to a record at a time helps with memory and processing.
Miller's Law: Only displaying between 4 and 5 groups relating to a record at a time helps with memory and processing.
Law of Proximity: For each record, related details are kept close together within the confines of the outer border for each selection.
Law of Proximity: For each record, related details are kept close together within the confines of the outer border for each selection.
Law of Proximity: For each record, related details are kept close together within the confines of the outer border for each selection.
Adoption Shop
Adoption Shop
Adoption Shop
Purchase and manage donations and adoptions via the app
Purchase and manage donations and adoptions via the app
Purchase and manage donations and adoptions via the app
Design
Design
Design
To ensure consistancy, I utilised the design system used for the WWF website, modifying assets and components to suite a mobile environment.
To ensure consistancy, I utilised the design system used for the WWF website, modifying assets and components to suite a mobile environment.
To ensure consistancy, I utilised the design system used for the WWF website, modifying assets and components to suite a mobile environment.
UX Psychology
UX Psychology
UX Psychology
Jakob's Law: Taking inspiration from ecommerce apps such as Amazon and Tesco, I interwove familiar design features with WWF's own, to ensure a seemless user experience.
Jakob's Law: Taking inspiration from ecommerce apps such as Amazon and Tesco, I interwove familiar design features with WWF's own, to ensure a seemless user experience.
Jakob's Law: Taking inspiration from ecommerce apps such as Amazon and Tesco, I interwove familiar design features with WWF's own, to ensure a seemless user experience.
Fitt's Law: To help ease navigation, I kept important primary features large and near the top of the page so the user can quickly identify and interact with these features.
Fitt's Law: To help ease navigation, I kept important primary features large and near the top of the page so the user can quickly identify and interact with these features.
Fitt's Law: To help ease navigation, I kept important primary features large and near the top of the page so the user can quickly identify and interact with these features.
Review
Review
Review
What I Learned
What I Learned
What I Learned
Thorough
Research:
Thorough
Research:
Thorough Research:
Speaking to the employees at Natural England really helped to inform what the app should accomplish in terms of features and environmental impact, and also helped clarify and delve deeper into some of the more environmental and conservation themes, regulations and values.
Speaking to the employees at Natural England really helped to inform what the app should accomplish in terms of features and environmental impact, and also helped clarify and delve deeper into some of the more environmental and conservation themes, regulations and values.
Speaking to the employees at Natural England really helped to inform what the app should accomplish in terms of features and environmental impact, and also helped clarify and delve deeper into some of the more environmental and conservation themes, regulations and values.
Sitemap
Creation:
Sitemap
Creation:
Sitemap Creation:
Creating a sitemap proved extremely useful in getting a feel for how the app is pieced together, and what features users would like to see. Creating an app from scratch was new to me and this helped me structure my thoughts and gave me a concrete base-level plan to build from.
Creating a sitemap proved extremely useful in getting a feel for how the app is pieced together, and what features users would like to see. Creating an app from scratch was new to me and this helped me structure my thoughts and gave me a concrete base-level plan to build from.
Creating a sitemap proved extremely useful in getting a feel for how the app is pieced together, and what features users would like to see. Creating an app from scratch was new to me and this helped me structure my thoughts and gave me a concrete base-level plan to build from.
Design
System:
Design
System:
Design System:
Helped keep the app consistent with itself and the WWF website. In creating the system, I learned how to implement existing WWF colours & themes in combination with my own ideas, to create a fresh and harmonious design. I also learned a lot about typography, sizing and structure when designing a new app.
Helped keep the app consistent with itself and the WWF website. In creating the system, I learned how to implement existing WWF colours & themes in combination with my own ideas, to create a fresh and harmonious design. I also learned a lot about typography, sizing and structure when designing a new app.
Helped keep the app consistent with itself and the WWF website. In creating the system, I learned how to implement existing WWF colours & themes in combination with my own ideas, to create a fresh and harmonious design. I also learned a lot about typography, sizing and structure when designing a new app.
Deadlines:
Deadlines:
Deadlines:
For this project I gave myself a strict deadline of two weeks. This was to experience what a design sprint type situation would feel like, and I am happy with the amount of research, design iterations and testing I was able to complete in this time.
For this project I gave myself a strict deadline of two weeks. This was to experience what a design sprint type situation would feel like, and I am happy with the amount of research, design iterations and testing I was able to complete in this time.
For this project I gave myself a strict deadline of two weeks. This was to experience what a design sprint type situation would feel like, and I am happy with the amount of research, design iterations and testing I was able to complete in this time.
Other Projects
Other Projects
