Lecture Notes
Please identity and explain a development process / activity where you had to evolve a more revolutionary approach to solve a project.
Torsten Possett
No brief from VW – just had to come up with an idea. Autonomous driving- how would you need to communicate with the car/ with a machine. Would it be with an app? Gain insight into how people want to communicate with machines. There is no outcome – the process is the outcome. Don’t go for the straight line in the beginning, go left and right and see what’s there.
Matthew Jones –
Canary Wharf project to celebrate them. Make it somewhere to live not just work. Fed all articles written about canary wharf is last 30 years into a programme to make different headlines. Algorithm writes the headlines from the framework they picked. System of type size and space dependent of where the text came from.
Creates bold headlines – computer generated.
Wouter Dirks
Redesign visual identity of string orchestra in Amsterdam.
Developed a Program where typography and form interacts with sound. What the input is interacts with music to create natural shapes and motion. Captures music in visual design.
Nicer Tuesdays – DIA Studio
Everything is connected in design and further to form an identity. Looking at how animals move to influence how type moves. Evolve the tools we use to fit with the changes in technology and state of communications in the world.
Idea Development
I reached out to some mental health experts who work for local charity Solent Mind to speak to them about my idea and show them my draft designs.
Overall the feedback towards the idea and the look of the design was positive.
Donna made a good point that my website idea is only as successful as the information I am showing on it. “I think the most difficult part of a site like this is ensuring that the information is not just easily accessible but also current and accurate. There are new hubs and services opening now and again, and others who have modified services because of Covid, for example. I would only say to put the appropriate mechanisms in place to keep the site up to date.”
She also pointed me towards Hub of Hope and StayAlive as similar mental health support and connection sites.




Hub of hope is very welcoming and easy to use, however, it only points people towards organisations not specific support options. This means the user then has to navigate the next website which may be confusing and hard to find support on. It is a good first step, but then falls short i think.
Design Development
I looked into developing a simple wireframe for my website
Landing page
- intro to what the website is about
- Asking question – “do you know what mental health condition you have?”
- Ability to click to search
- Link to explanation of conditions
- Link of explanation of treatments
“do you know what mental health condition you have?”
If yes to this then you go to ‘Filter support’ page if no ‘Quiz page’
Quiz
– series of questions to help user understand what they may be experiencing based on GP questionnaires.
- finishes with possible diagnosis linked to more info on each in a separate page.
- Find support button again
Filter Support page
- ability to enter location, age, condition and support type to filter to relevant support for you.
- Each result you can click through to for more information on that particular service.
- Can also click through to understand the support/treatment options available in more detail. Personalised email template available to fill in and send direct to service.
- What next button
Page for each mental health condition
Page for each service
Page for each treatment type
What next page
- offers advice for how to proceed with accessing support.
- Provides auto filled personalised copy for user to copy and paste to send to the service they want to use or info to bring along to a GP appointment so they can ensure they get the results they want & feel empowered
There are a lot of pages that my website needs to function well, but in the interests of getting this project finished on time, I am going to focus on creating an selection of example pages to show how the website would work.
I aim to create:
- The homepage
- The service filter page
- An example page for a mental health condition
- An example page for a treatment option
Design Development
I started to develop the look of my website further.


When looking into developing my design, I want a really clear brand to run through my project and make the website recognisable the whole way through.
To help me work out how to do this successfully I looked at some graphic designers who do this really well.
Studio Sutherl& create some really great brand identities such as St Albans Museum and Gallery, where they used a triangle shape to unify the brand and incorporated it in every part of the museum’s branding. This unified look is really powerful and helps make the branding instantly recognisable even without the logo or name.



Low Key design Company also show how simple branding can be incredible effective when run seamlessly through the entire project.



I think the to dots connected by a line in my design could be this element for me. They represent connection and the importance of connection in mental health support. I think using this idea through my website and other related content I produce could keep this theme of connection running throughout and also be a nice way to show how mental health connects us all in one way or another.
I sketched the line and dot combination in lots of different ways to see if anything sparked an idea.




I explored what the line and dots could be reminiscent of.
I liked the idea of a straight line between them that is given some kind of movement, like the vibrations of a guitar string that’s been plucked, a heart beat monitor, the waves made my sound and music.
This could be animated, or plucked by the user to create the movement, allowing them to give their own unique influence on the line.
A mental health journey isn’t linear – recovery isn’t a straight line it moves around and goes back on itself. So I looked at the wiggles I could put between the dots to represent this.
Mental health isn’t planned or uniform, it’s natural and messy so I should let my lines be the same. I decided to get some string and play around with the shapes it makes when randomly moved and dropped.














I like the shapes that this created, they are messy and complicated. I used these shapes as inspiration to create icons on Illustrator and tried a few different ways of incorporating them into my website design.






The variety of different lines felt like a great way to show the variety of experiences people have with mental health. It is infinitely different for each person, like the unfitly differs ways of letting the line move. This could be a really powerful way of uniting people with the differences of their shared experience.
I explored the idea of overlaying these lines on images of people – using it as a way of showing their unique mental health journey.

Another potential direction for this would be to look at making one line illustrations pop up between the two dots. This way I could use the idea of connection and also link each illustration to its relevant section.

I didn’t like this idea so much once I tried it out as it felt too similar to the illustration style used by Mind and a bit too controlled and staged. The organic and free style I had looked at before felt like it fit much better with the design for me.
I developed the main homepage design further with this in mind.





I think the look of this webpage is starting to get to a point I am happy with. It has quite a unified look with the squiggles that run throughout the page, along with the unified colour palette and use of fonts. When the website is created I would want the ‘Find Support’ button to follow the user down the page, so it was always within reach for them to click.
I think my next steps are to create a few more webpages for my website, as well as some other advertising material that utilises the brand identity. I want to create a business card or similar to allow people to give to people they meet who may need to find support.
Leave a comment