What makes a good cover letter?

I found this article on the Interaction design foundation that was very helpful when researching what would work best for making a good impression for future employers. Click here to read the article.

What are UX Cover Letters?

UX cover letters are short letters or emails that designers send with their portfolios and resumes to apply for jobs. These are personalized to introduce yourself and briefly explain why you are a good fit for the business. The cover letter will give the employer the first impression of you as a designer and whether or not you would be a good fit.

“A great, relevant cover letter can make me think twice even about weak candidates—think what it can do for strong ones.”

– Joel Califa, Senior Product Designer at GitHub

A Cover letter is a way to introduce yourself and support your portfolio and CV. A cover letter is a vital when having initial contact with any recruiter. It must pack maximum persuasion into the least space and in the right words to make the best first impression. As recruiters consider applicants for UX roles, they evaluate what they declare and how. In one page, you should convince a recruiter why you’re the best fit for:

1. The UX role offered.

2. Their organization overall.

When you bring your passion and dedication to life on your cover letter, you’ll help a recruiter envision how you might be the best candidate for that role and their team and working culture. Your UX portfolio and resume should reinforce that impression. While your portfolio will carry the most weight as recruiters consider your application, your cover letter is how you get them interested enough to do so.

How to Write a UX Cover Letter

Email generally suits most situations. However, judge how formal your approach should be when you research the organization, you should:

1- Personalize your letter.

It is always a good idea to personalize the cover letter and address it to the recruiter so when the time comes to applying to roles I could even call the company and ask who would be interviewing me so I can address it to them.

Don’t begin with Dear Sir/Madam. This sounds lifeless and gives the impression you’re applying to a generic recruiter in a scattershot approach. To prove a dedicated effort to reach that recruiter, find and use the name of the contact (typically in HR). Decide whether to use a title-and-surname approach (safer) or a first-name approach to access them in a friendly, professional way.

Match your tone of voice with the company’s personality. If your recruiter is trendy and bubbly, reflect that nature in your email. If it’s a more traditional organization, a formal writing style is better.

2- Keep it short and sweet.

Use one page. Recruiters are usually time-starved individuals who won’t handle lengthy letters. This puts pressure on you to fine-tune a concise message in which you show extensive knowledge about the company and role.

3- Show why you’re a good fit by explaining:

Why you want to work for their organization. Say what they have that attracts you: e.g., their values, teamwork style.

Why you want that UX role. Ensure you show you’d love it as a valuable next step in your career, rather than somewhere to escape to because you dislike your current situation.

How they will benefit from hiring you. You should declare your strengths and interests by showing how these can add value to a team. Flip your words around to hear how you sound from their side. Try to portray a proactive problem-solver who wants to grow with team-mates.

4- Read and re-read the job posting carefully.

Provide the materials they request. To filter out inattentive applicants, many recruiters include a question or prompt to mention a word/phrase.

5- Proofread, re-read and read it aloud.

One tiny typographical error will almost certainly ruin your application. So, use your spellchecking and grammar-checking software, re-read your letter and read it aloud until you’re sure about it.

Remember, your cover letter is critical to what happens next with your application. You have only moments to represent yourself to the recruiter through it—every word must count.

I really like how simple and clean this cover letter looks. It is easy to read and view.

 

This one I like but the content looks a bit too heavy.

While this one is nice I worry about adding a picture of myself. It feels a bit unprofessional.

Narrative design

I started off by thinking of how different brands market their products, even if they are owned by the same company, eg how BMW put out a high end, expensive idea but MINI put out a cute and fun one, even though they are owned by the same people.

Webpages can be simple one page websites where you move down, or you can have a multi-screen one where you move from screen to screen.

Considering my websites story

  • Start – Home page
  • Middle – Case studies
  • End – Contact

Inspiration for narrative outside of design

Films: Think of the narrative in films and how they flow. The pace – when is it quick? Are there pause? If so then why? Sometimes when its quick they will excite you and capture the audiences attention.

In the home page – that’s where I NEED to capture the audiences attention – I need to consider it the fast paced and exciting section (if this was a film that is what it would be). Then in the Middle (Case studies) it slows down to allow consideration and perusal.

The hierarchy sound be:

  • Critical info
  • Background and context
  • Nice to have

 

Here are some websites that showcased these principles extremely well:


Sketching out some ideas

Now I promise there is a method to my madness, so stay with me.

So I started by jotting down some of the characteristics I wanted my website to have – like a static navigation bar to make it easier to navigate the site at all times and reduce confusion. I also wanted to make its background clear so it would not clash with the main websites colour.

I also wanted to have some of my main titles overlaying the ends of the edge of the background colour box – I thought it would give it a nice and playful look. This is something that was inspired by my previous research.

I started playing around with colour to try and figure out how to best incorporate my colour scheme. I also wanted to use some aspects of my logo to try and have it create a pattern of sorts; I thought it might be kind of interesting. I decided to stick to the colour scheme I landed upon last year after creating my brand (Shown below).

I experimented with watercolours (It’s what I had handy) to see how the gradient idea would work out for my background before comitting to it. I also made some quick sketches of what the logo being deconstructed to create the pattern for the background could look like. I thought it was cool so I decided to try it at a larger scale.

I wanted to get a quick preview so I made a simple sketch on a sticky note. I thought it worked so I decided to further develop it but in paper.

While the picture bellow shows a very crude idea of what the background could look like it was an incredible insight – normally I jump straight into the computer but having to take a step back and draw it and fix it and change it forced me to explore different avenues – starting on paper works!

I then created a quick mock-up of the background using a mixture of Figma and Procreate – I did eventually place it in my sketchbook also but here is the digital version:

I then decided to go into Figma to create some quick mock ups for the peer feedback session to be had in the next IXD301 class.

I started off by creating my components – I decided to create soft, friendly and inviting buttons:

Here is my Figma file

Visual Grammar

Visual grammar are all the parts that make up a website, eg buttons, typography, illustrations, windows, etc… and just because a UI is not complex, it does not mean it is not beautiful of functional, there is beauty in simplicity.

Perfection is achieved not when there is nothing more to add but when there is nothing else to take away

A great example of this is seen in “If the moon was only 1px

Now not only is the type simplistically gorgeous, it really draws you in and the way how you scroll to go and search the rest of the website is very intuitive and engaging.

Once you start scrolling towards mercury he gives little pointers of text along the way to make sure you keep scrolling and also to alert you that this is just the illustration of the space in a funny and simple way.


Reflection

  • Simplify as much as possible – focus on the essentials
  • What can you do with constraints – think of how Instagram only allows the 1 size of images for posts and how they have stuck to it. It has been highly effective.
  • Focus on re-using elements and minimizing visual complexity. Think of how you can re-use the design of the main navigation and the footer. Think of adding a home button to cater to all audiences and convention

Language and typography

How did you write the content for your website? Is it in the 1st person? How did you speak? Is your language super friendly? Energetic? Calm? Basically, what is your tone of voice and your tone.

Ask yourself

  • Who are you? (As an individual or a business)
  • What are your values?
  • What’s your mission or purpose?
  • What do you hope to achieve? — In my case maybe add that you are looking for a year-long placement
  • How will we know if you are successful?

Think of Dropbox and how when a download is going to take a long time, they jokingly say “Grab a snickers” this is great design, it humanizes it and makes it easier to understand and maybe even alleviates a stressful situation.

“Typography is the craft of endowing human language with a durable visual form”. – Robert Bringhurst

I learned early on that I tend to find something I like – like a typeface – and stick to it instead of branching further out and continue to investigate the other options.

something I want to strive to achieve with the typeface I choose for my website is that it:

  • Optimize legibility, through the appropriate choices of typefaces
  • Improve accessibility by considering contrast between the foreground and background colours
  • Improve usability through a considered typographic hierarchy. – Think of how you structure the typography as this will guide the user on how to read the content and in what order.

Considering the visual grammar for my website

I started considering the visual grammar of the content of my portfolio site. I need to consider visual aesthetic, colour, typography, layout, …

I need to make the content work for me. Be expressive, to not be limited by my skills. Be as imaginative as I can.

While in class we were given a task that was great for getting my ideas flowing – Crazy 8s:  8 ideas in 8 minutes. Here is how I got on:

 

Creating an impressive handshake profile

Speaker – Eilis Spence, Employability advisor

Topic – Prepare for the virtual fair – how to create an impressive handshake profile.


Handshake

It is vital to have a good profile as employers can view it. Handshake is the middle man so the employers can interact with us. This could be the first thing an employer will see, making it very important.

  • MY profile must showcase me, my education, skills, experience and career aspirations.
  • There are 7 key areas to complete: My journey, education, work and extracurriculars, classes, projects and skills
  • Upload supporting files such as CV and cover letter.
  • Level of study – level 5 for second years. It’s very important to get this right as it will affect what job opportunities will be brought to you.
  • My journey is a short summary of yourself and what you are looking for. Its your chance to introduce yourself. It’s the first thing the employer will read – make yourself sound employable.
  • put actively looking for a job.
  • Ad your experience and add a few notes on your responsibilities and key roles.
  • When adding your cv make sure to check over the skills as handshake automatically adds things into this section that may not be necessary
  • Documents: this is where you can upload your CV and cover letter.
  • Organizations and extra curriculars  – add edge activities here also

Look up the video from yesterday on YouTube – here is the link.

Future jobs and opportunities fairs week 11-14 October:

  • Placement opportunities
  • Graduate jobs
  • Industry experts
  • Skills development
  • Skills boosting program with Allstate, ALMAC and Deloitte

Where does content and visual grammar come from?

This week what I need to focus on is the design of my portfolio as next week we will have a critique for our portfolio – we must have 3 pages done (especially the home page and case studies).

I need to create a high resolution mock-up; which is an image/prototype of how my website will look. It should look like the real thing whilst only being an image. I will most likely use Figma for this as it is the software I am most comfortable with.

Where does content come from?

  • Client:  A client can sometimes give the designers in any form; however, it may not always be in the right format, so it is up to us then to fix or suggest changes.
  • Self-generated: eg our portfolio. Blogs, design, branding,
  • Third party sites: eg Wikipedia,
  • User Generated content: eg YouTube, it creates the content for the user. Things that people make and then share. Social media in general. We are all basically content creator now. Instagram – we don’t realize it but within one post the amount of content offered is massive! Not only does it have the initial content but also ways to interact with it eg comment, like, tag …

Content has (or should have) a purpose

What is the acceptance criteria? Eg can people find my content or in my case can people find my portfolio in my website?

The acceptance criteria/ condition for satisfaction defines the criteria that must be met to suit the requirements of the user.

The 3 C’c: Card – conversation – confirmation.

Content curation

This is the process of sorting through the vast amounts of content on the web and presenting it in a meaningful and organized way around a specific thing.

Doing this is a must as we are living in an era of oversaturation of content and having someone that can sort through that is vital. Think fake news and how negatively impactful they can be when they are not called out.

Good content should be appropriate, useful, user centered, clear, consistent, concise and supported.

It is important to get good sources of information to better inform your design decisions.

Here are some great sources of content

This is a great resource for good UX content. I have actually read a few of the articles and learnt some tricks from them.

I really struggled with coding last year so this is a good resource, although there is so much information out there on coding that I was not short of information – it was kind of overwhelming actually. So the way the website was layout made it easy to find content. Now that is good content curation!

The great thing about this magazine is that it is centered towards UX designers so the content there is very relevant information here for me – this could be something I could bring up in interviews.

This is a great example for self-generated content.

Apart from being extremely beautiful and effective it is incredibly engaging – something I must strive for my portfolio website to be.


Idea

This is something as a designer that I could do, send a newsletter each month, it doesn’t have to be ground breaking work, it can be useful content, an update on your work – this can help grow your audience. This would actually be a great idea for when I am doing placement?


User and job stories

User story is a way of pinning down what you need to do. It helps you identify the users needs to better design around their wants and needs.

An example of how this would work, would go as follows:

As a [person in a particular role]

I want to [perform an action or find something]

After conducting some more research on user stories and job stories I found that Sarah Winters explanation was the most helpful.

According to Winters user stories and job stories are ways of capturing what a user wants to do. They are often written on little cards and stuck up on the wall so that the whole team can understand the user’s perspective.

User stories can look at follows:

As a [person in a particular role] I want to [perform an action or find something out] So that [I can achieve my goal of…]

User stories are great if you have a number of different audiences who might all want to consume your content. But there’s an alternative to user stories that might be better if you only have one audience, and that’s job stories.

User stories are a great way of figuring out what the different user categories are. These should NOT be specific as they restrict creativity.

After some more research I found a very interesting article by Alan Klement on ‘Replacing The User Story With The Job Story’ – his idea is that we design problem in a Job, focusing on the triggering event or situation, the motivation and goal, and the intended outcome: When _____ , I want to _____ , so I can _____ .

Job stories always start with:

When [there’s a particular situation] I want to [perform an action or find something out] So I can [achieve my goal of…]

Here is an example:

How would you design a fracking website? Maybe talk to home-owners, community groups, geologist people that work in this industry. It could have a scientific area with raw data as it would interest a geologist

Job stories are all about context and causality.

Here is an example he provided on his website that really helped me understand how to best use these  design tools.

1 – User Story:

As a moderator, I want to create a new game by entering a name and an optional description, so that I can start inviting estimators.

2- Job Story:

When I’m ready to have estimators bid on my game, I want to create a game in a format estimators can understand, so that the estimators can find my game and know what they are about to bid on.


Task 01:

Create 2 user job stories

Remember it is not about the designer but about the user.

Eg When [ ] I want to [ ] So I can [ ]

Results:

As an employer I want to assess a student’s potential

As an organization I would like to easily find the contact details so I can show my interest in hiring them.

When I want to find out more about interaction design

Design your career journey

Reflection

I found that attending this event was greatly beneficial as it helped me focus on the things I still need to research and focus on to not only decide what career path I would like to pursue but also to research and consider my alternatives. I have become very interested in applying to study abroad instead of taking on a placement; having said that I would still like to research and apply for placement as it would grant me an amazing learning opportunity as well as real life experience in the workplace within my field of study. All in all I found this session to be greatly beneficial and I will continue with the tasks to earn the EDGE accreditation and further progress in my career journey.


Careers research

As park of my preparation for placement and as a way of exploring my career options I decided to attend the EDGE accredited talk posted on Handshake on designing your career journey. The following are my notes on the talk and the research I conducted thereafter.

Speaker: Dr Donna Caldwell – employability advisor – d.caldwell@ulster.ac.uk

What will be covered:

  • Career planning through reviewing Ulster’s employability journey
  • Researching career option
  • Before starting to apply to jobs it is essential that you complete your handshake profile.

Great websites to search for work experience

  • Prospects
  • Target jobs
  • GradIreland
  • Rate my placement

My options

  1. International work experience: research at Go global
  2.  Online professional profile and networking: Digital learning hub – digital presence, LinkedIn, Handshake – Events
  3. Professional skills profile:

Never be afraid to seek advice – Ulster university offers their students support in planning their work experience, placement, internship or graduate opportunity by offering career guidance appointment.


Tasks

We were tasked with making a mind map to help us in our career planning journey – This is something I was very keen to do as I had been doing my own research before starting this and was looking forward to the help and guidance.

Here are some mind mapping template resources we were given:

  • Coggle – mind mapping for beginners
  • Mindly – for mobile mind mapping
  • Diagrams.net – free mind mapping
  • MindMup – for creating public mind maps
  • Stormboard – for in-person mind mapping sessions
  • Lucidchart – for turning your mind map intoo an organised flowchart
  • Ayoa – for a modern approach to mind mapping
  • MindNode – for Apple users.

Here are also some examples that were shown to us as part of the PowerPoint presentation:

Learning outcomes

How can I get my EDGE accreditation with this activity?

  • By acknowledging the importance of career ownership and planning through the development of a visual map.
  • Identify and articulate my career goals and ambitions by researching relevant industries and sections.
  • Effectively present and adopt professional standards in an online context.
  • To learn the importance of body language and personal projection in delivering an effective online presentation.

Assessment details:

  1. Attend the initial 1 hr webinar session (this one).
  2. Create a mind map through researching your chose career area/s using the prospects website – what can I do with my degree? DEADLINE – 1 month max (there is no specific date as it is an extra curricular but the sooner the better).
  3. Attend an individual 1-1 coaching session with your employability advisor – to discuss draft mind map. My employability advisor is Stella So – s.so@ulster.ac.uk
  4. Deliver a short, impactful PP presentation (5 mins) based on the mind map research to highlight your career plans and goal/s. Feedback will be provided on the day.
  5. 300 word reflection essay summary. Once completed send to employability advisor that I did the presentation with. It will then be added to be EDGE record by them.

AIM to do the EDGE PLUS award. Do as many skills talks as you want as it could lead to a scholarship. Great for upskilling and progressing in my degree.


Future events

Future jobs and opportunities week 11-14 October: More information here

  • placement opportunities
  • graduate jobs
  • industry experts
  • skills development

Schedule of events:

  1. Skills boosting programme —- 11-14/10/21
  2. Graduate virtual fair (All disciplines) —- 12/10/21  1pm – 6pm
  3. Placement & Internship virtual fairs – Comp, Eng and construction —- 13/10/21  1pm – 5pm
  4. Placement & Internship virtual fairs (All disciplines) —- 14/10/21  1pm – 5pm

E&C and EDGE activities

  1. #PreparefortheFair: What can I expect from the virtual fair?  —-   04/10/21
  2. #PreparefortheFair: How to create an impressive Handshake Profile —- 05/10/21
  3. #PreparefortheFair: How to make a good impression at the fair —- 06/10/21
  4. #Future Jobs & opportunities week – The ultimate CV makeover —- 11/10/21
  5. Skills for your future (EDGE accredited) —- 15/10/21
  6. Improve your presentation skills (EDGE Accredited) —- 20/10/21
  7. Design your career journey (EDGE) —- 26/10/21
  8. Improve your presentation skills (EDGE Accredited) —- 03/11/21
  9. Design your career journey (EDGE) —- 10/11/21
  10. Improve your presentation skills (EDGE Accredited) —- 17/11/21
  11. Skills for your future (EDGE accredited) —- 24/11/21

Preparing for placement – 1

I will be honest I AM STRESSED!

So I have to find placement and so the first thing I need to do is research and brainstorm. Here are some of my initial thoughts and ideas after hearing some of the tips Kyle had for us in class.


Things I should do to improve my chances

  • Side projects – Reference the logo design you did for the ice cream shop during the summer.
  • Check out the job opportunities in Slack, Handshake, LinkedIn, etc…
  • Check out communities like UX NI, ladies that UX as these can be great learning tools.
  • increase online presence – slack, LinkedIn, Instagram, etc…
  • Apply to the study abroad opportunities.
  • Apply to all placement opportunities, what will you loose? The worst they can say is no.
  • Take up side projects related to your interests in the field of design as these make for great learning opportunities. Also consider attending fayres.
  • Bigger organizations tend to offer placement opportunities first – eg Rapid7.
  • IBM look up – they have UX jobs.
  • Specify that you are looking for a year long placement/internship in your portfolio. Narrow it down. What can I do? Can I do it? How can they contact me? As a designer the portfolio is a must, it is way more important than a CV, it acts as a meet and greet. Show what you are really good at, what IXD activities you like to do? What makes you different from other designers?, On which projects did you bring the most values? What interesting stories can you tell about the work you did? Show that you can do the hard work that comes before the pretty pictures – SHOW YOUR WORKING, think Math GCSE.
  • Case studies will get you a job.

 Interview questions

  • What do you find interesting about the industry?
  • How do you keep up with such a fast paced industry – My answer: By being a curious octopus and a forever student.
  • What tools do you use on a daily basis?
  • What is your process when creating illustrations/websites/wireframes, etc… ?

Impressing employers

  • Preparedness – it will come across poorly if you attend an interview unprepared.
  • Identify the key skills being asked for that role and try to guide your cv towards presenting you as the ideal candidate.
  • Ask about timing – how long will you have to wait until you hear back from them?

Portfolio research and Inspiration

As a way to improve my portfolio website and my career prospects I decided to conduct some research but first I decided to make a list of the things I would like my portfolio to be:

  • Portfolio site and content strategy. My Instagram, LinkedIn, Slack must be active, functional, consistent and professional; they should all match, think brand recognition.
  • My portfolio should be simple and functional.
  • I will aim to tell the viewer a story when writing my case studies.
  • Skills I would like to include: Wireframing, prototype testing, web development, illustration, branding, Iconography.
  • Design experience I should include: feedback Stephen (client) gave for the work I did on the ice cream shop logo as a quote for my portfolio page on the logo design.

Learning from others

I started off by looking for inspiration in Pinterest and then created a Pinterest board – I will be updating this board as I work on my portfolio throughout the semester. Here is a link to my board.

So I decided to take a look at some of the portfolio websites some previous IXD students completed while at the same stage that I am currently at to better understand what the expectations are and to learn from them.

Calum Dixons

Dixons website attracted me due to its simplicity. In his main/home page he uses a main title and a secondary title (information architecture) as a warm and short introduction. It makes me as the user feel welcomed and drawn in, this is something I would like to do in my own website.

He also added a little cute thing in his title home page where he added gifs over the underlined words. This adds a level of quirkiness and familiarity that made visiting his website all the better.

I noticed that he doesn’t have a full CV, just a sort summary of one. Nice and brief. I would however have added a call to action button to download his full cv, personally I think it would have polished his ‘About’ section and allowed possible employers to get his full experience. I do however like how he gave a short summary of his experience. It made it easy and simple to digest. I really liked the aesthetic he created by being consistent with his black and white theme. This also made it easier to digest the information.

These design principles – especially his idea of a summarized CV is something I would love to include in my own portfolio website.

I liked his use of relaxed and informal language in his contacts section of his website; I appreciate the fact that he didn’t use an email box and instead he put his email address with a link to send the user straight to their email to contact him. He used playful language for his social media handles which was funny and cute- a very nice idea I would like to incorporate into my own website as it fits my brands tone of voice.

Take notice of how he added a bit of playfulness to the image introducing one of his case studies by adding a little motion for his case studies when you hoover over it – its awesome. I also like how he very briefly introduces his work in his home page.

He shows his research first, then his rough drafts, then his thoughts, then final products and reflections (they are super important).


Matthew McLaughlin 

When you first enter the site, you are met with big text introducing his skill sets and ability to produce clean and simple design – his ‘home’ page is easy to read and follow. I like that he gave a quick, short bio about his skill sets, values and where he can be found on social media.

I like how he uses colour without making it overwhelming or overpowering and how his consideration for colour, type and information architecture ensures that the content is accessible.

Overall I think that this page is simple and aesthetically pleasing which easily engages users.

His layout never chances for his case studies, it gives a nice flow and continuity for the site. The length of his case study is ideal – not too long but with enough information to interest prospective employees or clients.

I also liked his use of a sticky navigation bar as it made it easier to find your way back and navigate the site.

I really enjoyed his tone of voice throughout the site – relaxed, friendly yet professional as it made you feel like you were actually talking to him and it also reflected on him making me think he might be a friendly person in real life.


Alex McCormick 

*** Her website is no longer available so I can not show any pictures of it ***

Alex works in whitespace now (small company, they only ever take one student on). She shows more than the app design, she also shows the different elements and illustration she created for it. I really liked how she also showcased her other interests that are still relevant to her thought process or how she tackles a design problem.

When the time comes I would like to also have a section for my illustrative work.


Gemma Ferguson

What stood out to me the most in Gemma’s website was her layout for her case studies as it was clean, simple and easy to follow – it felt like I was being guided through the information.

I also liked how she used a banner at the top of her case studies as a way of a preview – I also really appreciated the fact that she toned down the colours of the banner so it would not take away from the information and allow the writing to be seen clearly.

Gemma utilizes white space very successfully and consistently in her case study area making it easy to read and understand. I also like how she showcased her sketches as a way of explaining her design thought process.

Reflection: I would like to apply a similar style in banner as a quick introduction or preview into the work explained in the page. I also want to step out of my comfort zone and maybe use my white space more successfully.


I then decided to look at some more experienced designers

 

Illustrated by Mabel

This was a happy accidental find. I like how she used a collage styled way of showcasing her illustrative work while still keeping the artwork organized in a grid layout.

I am not in love with her menu bar – I think it gets confusing and that she added too many options making it easy to get confused, I think that for example the ‘How can I help you’ section of the menu bar is not needed and that the ‘contact me’ section can just as easily cover this need.

I like that she kept a white background so her work would not be obstructed or upstaged.

I really liked how when you hover over one of the items on the menu bar they are highlighted in pink and underlined, it is a small touch but it really helps to draw in your attention and it fits her website style perfectly. I do however think that the pink is too light and a slightly darker colour would help resolve the contrast issue.


Owltastic

This is an incredibly beautiful website and it was an honest joy to scroll through it and view it. It left a very positive and lasting impression (Something which I would ideally be able to do with my website).

It was different, memorable and kind of quirky – the message she shares as part of her intro is also perfectly complemented by the artwork behind it. It is simple and uncomplicated and while it is a drastic change in style compared  to the previous websites I have looked at; it proves that colour when used correctly can be incredibly successful.

The text stands out and the call to action button comes in at a perfect time to encourage interest.

Something I found quite interesting is that while she does provide a brief preview of her work, her case studies are explained in medium so essentially her portfolio is an organized guide or way to show her work a posted on Medium and Dribble which is a very interesting way to utilize a single page website.

Brief and to the point – you can see everything is very carefully considerate and refined and after reading her blog post on re-designing her website I can see why as she has been working under the name ‘owltastic’ since 2008 meaning that she has been able to refine the design and use her many years of experience to make the successful website I see now. Practice really makes prefect.


Vandana Pai:

Her use of typography is awesome. It takes a real skill to reduce a site down in the way she has done it.

Her logo is also incredible – I am kind of in love with it tbh.

The way the case studies have been displayed is simple gorgeous. A quick and simple description is given. The only part of the text that overlaps with the coloured boxes are the titles for each project.

Simple, collected and easy to use.

I like how she continued with the same box as she puts in a small box as part of the preview of her case study in the main page. I would argue that the content is lengthy – especially for my purposes but display wise her design is very easy and simple to understand – very successful.

 


Here are other great examples I also looked at but did not decide to talk about in great detail

  • Dawson Andrews is a great local NI company.
  • Jordan Moore
  • Jack Mcdade has a great and unique website with funny little intros of himself. It was enjoyable and entertaining but it did feel crowded. I must give it to him though, it was not boring.
  • John hicks designhas a great layout example for the case studies.
  • Xavious Cusso – now this is a cool website although it was at times complicated and kind of confusing. Very cool and engaging though
  • Tiffanie Mazellier– Incredible, simply incredible. It is definitely worth a look. She was featured as Site of the Day for May 23, 2020 in Typewolf

I like how when you hoover over an option in the menu bar, it is highlighted by a cool little doodle looking circle.

I kind of lost my mind when I saw the cursor change to be a circle with the phrase “See case study” – breathtaking.

When you hoover over the line drawing a real-life picture of the designer comes up which as you move the cursor over the image becomes distorted – again very interesting and engaging.


Reflection

The best design is the design where there is nothing else to be taken away

 

Content planning for my portfolio

 

Considering my UX workflow/Design thinking

Discovery/Research

  • Research for Inspo: A very useful tool for this is Dribble, it’s like Pinterest for designers – some of the UI in there does NOT work though so take the designs there with a pinch of salt if you will. Just researching on dribble is not discovery though. Discovery is finding designers and finding out how they structure their website and how they work, what their process is like.
  • Understanding my user: Conducting discovery is simply searching for data, and discovering what my audience needs and understands. What words do people type when they search the web? What kind of language do they understand? Google trends is a great tool for understanding your audiences vocabulary. Researching buzz words around the industry and seeing what the best fit is can be greatly beneficial like for example how in the UK the word ‘placement’ would be not be recognized in the US as they would instead use the word ‘Internship’.
  • Getting started on paper: sketches, mind-mapping and general idea generation. NEVER EVER jump straight into software, first paper and pen

Things I need to consider?

  • Be specific:  Specify that you are looking for a year long placement/internship in your portfolio. Narrow it down.
  • Skills: What can I do? Can I do it? How can they contact me? As a designer the portfolio is a must, it is way more important than a CV, it acts as a meet and greet. Show what you are really good at, what IXD activities you like to do? What makes you different from other designers?, On which projects did you bring the most values? What interesting stories can you tell about the work you did? Show that you can do the hard work that comes before the pretty pictures – SHOW YOUR WORKING OUT, think Math GCSE.
  • Case studies: they will get you a job.
  • Call to actions: Every homepage should have a call to action. Introduce yourself first though, then add a call-to-action button. Treat it like a real conversation. It should ideally take the user to your portfolio.
  • Text design: what typeface best suits my portfolio
  • Sketches: Show your thought process and how you start on paper.
  • Visual design
  • Prototype/build: This is the part where you build it. Use Figma for this also to show the usability, make it there so the user flow is not only shown but also functional so you can see what stage you are in and how it presents.
  • Test: surveys, user tests, etc…
  • Discuss your work: This is when you show it to other people. Show it to more than your friends as others give more truthful opinions. Get advice from peers when at all possible. If needed go back to the sketch stage and fix the issues.
  • Deliver but keep refining

In my portfolio what is the most important thing to show?

  • Work
  • Contact name
  • Name
  • What am I?/What kind of designer am I? Does my portfolio reflect that?

What to include into the case studies?

  • The problem
  • Who you worked with?
  • What tools you used?
  • Discovery phrases (how you go about solving the problem?)
  • The process you used to overcome the problem: the lo-hi wireframes, prototypes, sketches, personas, user journeys and research.
  • Challenges you faced and overcame – understand the problem and outline the solution, even if you don’t have time to overcome it.
  • The final outcome

Initial ideas and sketches

As a rule I like to get started on paper, I noted down some quick ideas of how I want my content to be laid out and also some quick points of what information I should add.

I did a quick wireframe of what I would like my website to look like, I want to create a website that will flow easily and will be easily read.


Writing and planning my content

 

Home page

Here I will add a short introduction at the start of my website – it needs to be simple and concise. It needs to draw in the viewer and also quickly inform them of the key information I need them to know such as my name, what I can do for them and possibly where I am based.

  • My name: Emily Ussher
  • Short description: I am just another Irish/Venezuelan Product/UX/UI designer and self-appointed explorer designing her way through life with a user centered state of mind.
    I am currently looking for placement, get in touch if you would like to hire me.
  • Call to action button: Go on, take a nosy

Reasoning: I included my name at the top, some relevant information about myself and what I do/the services I can offer. I might add a call to action button that playfully encourages the viewer to keep on looking – “Go on, take a nosy” seems like a cute and fun way to encourage the viewer to peruse further my website, that and it matches my friendly brand vibe.

I will also need a short introduction to some of my work – Maybe I could talk about some of the skills I used when working on the project. I will need to give a short overview and an eye-catching image to draw the viewer in.

 

Contact/Get in touch

I will put this information at the bottom of my website as a footer – I think this should remain consistent throughout my website, this way it will be easy to use and navigate making it easier for viewers to find my work and my socials so we can network.

  • Title: Get in touch
  • Call to action statement: Do feel free to stalk me online or even better contact me and maybe hire me?
  • Socials to include: Email, LinkedIn, Instagram and my blog

 

About

Title: Emily Ussher

Blurb: Hello! I am just another Irish/Venezuelan Product/UX/UI designer and self-appointed explorer designing her way through life with a user centered state of mind.
I am originally from Venezuela; I found my love of art when I moved to Northern Ireland at 13 as it gave me a communication tool that I did not have at the time. My multi-cultural upbringing has offered me a different perspective and point of view – something that is always evident in my designs.
My mission is to create and showcase unique, high quality designs in an accessible manner to make users interactions with content simple and easy.
I am currently looking for placement, so get in touch if you would like to hire me.
‍Call to action button: Want to see more? here is my CV

 

 

Case studies

App design – Bible app

  • Page title: Bible travel app
  • Brief: As part of our second module in first year we were tasked with creating a travel app. I decided to take a more abstract approach to it as I wanted to design an app that would stand out from the ones my peers would create.
  • Software: Figma, Miro, Procreate
  • Skills: Web design, Prototyping, Wireframing, User research, UX and UI design, App design.
  • Call to action button: Go on, take a nosy …
  • Discovery: I started off by considering all the different areas I could technically consider as ‘travel’. I considered taking a more ‘normal’ approach but eventually decided to make the project a bit more personal to myself. I realized that there was a big gap for young Christians when it came to interactive apps that would not only teach but also guide them through the years as their knowledge and understanding grows – Three Sixteen was my solution to this problem.
  • Getting started on paper: A very important part of my design process is putting pen to paper. This is something I struggled with at the beginning as I was used to jumping straight into the computer. Having to slow down and actually have to think things through was a big help though. This is something I slowly became better at through the duration of my first year at university.
  • The problem: I decided to create a bible app as I noticed there was a very large gap in the market for truly interactive bible based learning platforms. I was largely inspired by some of my childhood books I had growing up that were truly interactive in the way of textures, colours and imagery. I started thinking of how as I got older and my knowledge grew I started moving on from simple books to harder more in depths evaluations of the different books in the bible and how this process enabled me to further my knowledge. The problem is that this is paper based learning method that spreads out over many (very heavy) books; my aim was to digitalize this journey to create a platform were the user could learn and be guided as their knowledge grows. Three sixteen was my solution.
  • Designing: After sketching out my ideas I decided to focus mainly on the younger demographic or users that would be using this learning platform. I decided to use a lot of fun, eye catching colours to appeal to that age group. I designed my illustrations in Procreate. At this time I did not have much experience with this tool so this was a very good learning opportunity for me. I created a little character to take you through the app. I gave her a map to give the idea of taking a journey through the different biblical events.
  • Reflection: I was too quick to jump into procreate and I had not come to grips with wireframing at this stage – at least not correctly – I now understanding their importance and should I have a chance to work on this project again, this is one of the changes I would make to my process to improve my project
  • Peer feedback: This is something I found incredibly hard to do at the beginning – giving feedback. I found that people were not quick to give feedback due to fear of offending but I found the critical feedback given to be the most useful for me as this is what helped me improve the most. Click here to see my blog post detailing how I took the feedback onboard.

Branding

 

  • Page title: Branding
  • Brief: As part of our third module in first year we were tasked with designing our own brand and to develop our identity as designers
  • Software: Figma, Miro, Procreate, Photoshop, Illustrator
  • Skills: Web design, Prototyping, Wireframing, User research, UX and UI design, Branding and Illustration
  • Call to action button: Go on take a nosy …
  • Research and discovery: A big part of my design process is based on research and experimentation. I like to record this not only on paper but also on my research blog. I do not like designing in a vacuum so a big part of my process is also looking at other more experienced designers work and creating a moodboard; I normally do this on Pinterest. I wanted to create a modern yet timeless logo and wordmark – something that I would (hopefully) not cringe at in 10 years time. I have a great love for architecture and fine art so I wanted to incorporate some of those clean, modern and at times abstract elements that I feel best describe me as a designer as I like to apply my knowledge of other artistic disciplines to my work; in fact I often am inspired by visual artists like Alex Gross, Mr. Doodle and even some past IXD students like Inga Hampton.
  • Getting started on paper: Another big part of my design process is putting pen to paper. I started off by experimenting with the letters of my name to start forming my logo design. I took some wild turns along the way but I eventually designed my current logo by merging the ‘e’ in my name and the ‘u’ from my surname.
  • Going digital: I created my logo and illustrations using Figma and Procreate. I decided to go with an abstract and flowy design as I felt that this would best represent me. For my visual marque I started off with a simple line drawing but then decided to showcase my illustrative skills further by making an illustration of myself that looked more realistic. The profile illustration I use in my ‘home’ page was my final outcome. Here is the Figma file for my logo design.‍
  • Colour: I was careful in considering the colour scheme for my brand and website as I wanted to create an accessible colour scheme . I used Adobe Color to ensure my selected colours would be inclusive for all users. I decided to go for a soft, calming, fun and feminine aesthetic as I felt that it not only best described me and my personality but that it fitted my brand well also. I started by creating a gradient from my profile image for all my socials and went from there. Even before designing the new layout for my website I wanted to have a simplistic and minimal color palette as I wanted the focus to be on the work and not on the surroundings.
  • Website: Research. That is how it started for me, I found that visiting other designers websites and even some design agencies was a big help in informing me what good website architecture looked like, how to prioritize content and how layout has to be carefully considerated. I explain this in more depth in my research blog. I was encouraged to wireframe my designs to better understand how my website would work – this is a skill that I have improved upon since 1st year – slowly but surely and that I am still striving to improve upon. I created the design for my website at the start through trial and error (and many wireframes). I was trying to learn HTML5 and CSS so I could write my own website from scratch however due to time constrains I changed my approach. My old website (which I constructed is still posted on GitHub though). I also go into more detail on this process on my research blog.
  • Results: While there are still things I would like to change and improve upon, I have managed to create solutions that meet my current needs.

Travel app research

Research

I want to create a very different type of travel app, I want it to be very unique and memorable.

I started off by writing down some of my ideas, I decided to try and make it personal in a way.

Moodboard

  • Here is a link to my Wireframe Pinterest board.
  • UI moodboard link.

I really liked the simple illustrations used for this app design, this kind of design would work both for children and adults. I also like how they used a darker blue for the menu bar – it highlights and draws the eye there.

  • UX moodboard link.
  • Time travel moodboard link.
  • Space travel moodboard link.
  • Bible travel app moodboard link.

I really like this simple Illustrative style, the colours make it look nearly real while still keeping that playful illustrative style. I do however feel like it might have a more grown up vibe to it, like late teen/adult sort of aesthetic?

  • Gauntlet. This is an app I really liked, I loved the layout details.

I really liked the dark colour scheme as it is easier on the eyes.


My aim is to create a Bible app that takes kids through time to teach them bible stories. I know a lot of kids who have missed out in Sunday school because of Covid and I figured that this would be an ideal app for times like this and just in general. Growing up I would have loved an app like this as it modernizes the Bible without adapting the message. A teaching tool.

I think it might even be a fun idea to make it an app that grows with you? As you get older and are able to tackle more difficult Bible passages the app will help you and even offer recordings in a podcast manner of meetings with ministry and bible reading teachings.

I went into Procreate to start creating my illustrations for my app

I tried to create a rocky shore to illustrate Jonah and the big fish. I then decided that I didn’t really like look of it so I kept the wave and added the other elements of the story.

I started off by adding the sun behind it but I think I put it too low.

I drew a whale instead of a fish as in the Bible it is referred to as a fish and a whale.

I changed the look of the whale as it looked a tad too happy before. I also created a little avatar with a map with a cross on it to play on the whole bible travel app theme.

I then decided to focus on Noah and the ark, I kept the same wave as I started with as I felt like it added a bit of playfulness to the story.

These are the first drafts for my travel app screens.