Small business website revisited

So far this project was the most challenging for me. As a result, I learned new skills like improving site modularity using PHP includes which is super helpful and a good habit to build in case a website project has several pages along with learning javascript and adding a 404 error page.

Following is a list of changes I made:

1. Wrote php includes in the index file and added php include files for site navigation, footer and the meet us section which is repeated throughout the site.
2. Added a custom 404 error page using .htaccess and added a link back to the homepage.
3. Added titles for all pages which were missing from the previous version of the site. This would help in user experience and in SEO.
4. Added javascript for store opening hours and closing hours.
5. Following the feedback I received on the previous version, I changed the <article> tag which I wasn’t using correctly to <div> tag.
6. To improve accessibility I added better descriptive alternate text to the images in the site.
7. Changed the main header image which is more fitting for a brick-and-mortar shop and indicates the bakery website is of a physical store.
8. Double-checked image sizes to make sure all images are optimised for site loading speed.

“UX is a method; a process for solving problems, contextually. We make mistakes early to avoid more expensive ones later.”

-Aaron Hoffman

Introduction 

This essay will cover the fundamental ideas I learned during the two-day UX Design workshops by Stephanie Troeth and Chris How. It will expand my learning of the core concepts of User experience design, setting objectives for research, research methods, analyzing data and the product design stage which includes ideation, sketching, prototyping, testing, and iterating. Moreover, the essay will act as a plan of how I will integrate my aforementioned learnings into my major project idea.

Major project idea

I am aiming to build a website for individuals who want to learn digital product design i.e designing mobile applications and websites and start working remotely. The primary goal of the MVP site would be to act as a guide for them to learn theories of user experience design and provide them with practice project briefs. In the future roadmap, an added feature of the site would be the ability to connect with professionals working in the field to act as mentors and help newbies with their learning journey. 

UX research direction 

User experience (UX) research is the process of learning about the wants, desires, and pain points of users through feedback procedures and observational techniques. In order to design user-centered products and make educated decisions, it is important to understand your users and acquire context and views.

Two-part research is to be carried out for this project. First would be the primary research of information and platforms available on the web, and second would be generative research; hearing directly from my target audience and would include questions that would aim to explore the challenges they face when first starting to learn about UX design and trying to break into the industry. This would help in forming my problem statement and would validate or invalidate some assumptions. 

Setting objectives

In simple terms, UX research objective is a statement of what you want to learn about your customers or users from carrying out the research. In our session with Steph we talked about the importance of setting clear research objectives as it acts as a guide for us to align on research outcomes. When coming up with a list of research objectives, we can make use of different types of research objectives, close-ended, semi-open-ended, open-ended, and exploratory. It’s important to keep in mind that this research can be carried out at different stages of product development.

Before the start of product development stage, the following can be the possible objectives:

• Assess the workflow of users when learning about digital product design online
• Learn about the kind of channels they use for learning

At a later stage, when my MVP is ready for testing I might make use of following objectives:

• Assess the findability of content on the website 
• Examine if the website is user friendly 

Research methodologies

In UX research there are several different mythologies one can choose. Deciding on a specific method or a set of methods depends entirely on the context of the project and one might use different methods at different stages of product development. 

Generative research methods such as interviews or field studies are used to discover new information about users’ goals and motivations and better understand their behavior—in and outside the product. On the other hand, evaluative research methods such as usability testing are perfect for assessing a specific product solution to ensure it’s easy to use and works as intended.

Using both generative and evaluative UX research during the design process ensures the product we’re building addresses real needs, solves existing pain points, and does these in the most viable way. This continuous learning process uncovers new insights to help us create value for your customers.

In my case I can decide to do online surveys of my target audience which would include asking them a set of close-ended and open-ended questions using google forms, which would provide me with valuable data which I will later on use to develop helpful insights, figure out my target pool’s pain points and possibly help me for the content of my website. 

Target audience

A target audience is a group of people identified as likely customers of a business. People in a target audience share demographic similarities, such as age, location, or socioeconomic status. Defining a target audience will help me craft my project and in retrospect; to come up with relevant content in a language they understand. 

My primary target audience includes individuals with familiarity with design who want to learn the skill of digital product design. The secondary group includes newbies in design who want to explore digital product design as a potential career prospect. The tertiary group includes anyone with the desire to learn digital product design. 

Design thinking process

One of the key things that I learned from Steph’s workshop was to never fall in love with the first version of your design because when designing for users we are at first making design decisions based on assumptions that are later validated or invalidated via user testing. Beyond that, the data we gather from attitudinal research is all about what users say but how the user actually uses the product and their behavior can be very different. Therefore as designers, we should take an iterative approach to design i.e define, develop and iterate. The end product can always get better and better with frequent loops of feedback. 

Design thinking is a process that seeks to solve complex problems by approaching it from a user’s perspective. Generally, the process can be divided into three key phases i.e immersion, ideation and implementation. 

Immersion

Before starting any project, we as designers need to put ourselves out of the equation and think from our target user’s perspective. In order to that we make use of the empathise stage of design thinking process. The aim of this step is to paint a clear picture of who my end users are, what challenges they face, and what needs and expectations must be met. In order to gain said insights I came with a set of questions that will act as my primary survey. 

The next stage is to define a problem statement. The data derived from the above survey will help me define my problem statement. The problem statement will set out specific challenges I will address. It will guide the entire design process from then on out, giving me a fixed goal to focus on and helping to keep my user in mind at all times. 

Furthermore, I will use the data gathered to create user personas and empathy maps to better understand user needs which will help me with designing and content creation for the website. 

Ideation

After coming up with my problem statement and having stepped into my user’s shoes the next stage would be ideation. Quantity over quality is the golden rule here. The ideation phase gets us thinking outside of the box and exploring new angles. By focusing on the quantity of ideas rather than the quality we are more likely to free our minds and stumble upon innovation. 

During our UX workshop with Chris we did a fun exercise where after defining the problems people face with single use plastic we did the 8-fold page exercise where we folded a piece of paper into 8 part and in a short and limited amount of time we had to come with 8 different ideas for our desired solution. The limited time constraint here forced us to just come up with as many ideas as we could and not strive for perfection in any our quick sketches. This exercise helped us to quickly put all our possible directions on paper and started a creative loop. We also made a quick sketch of the ‘worst possible idea’ for the bottle exercise, which was something completely new to me, the point of that was to understand what we absolutely do not want to do, and as a result, it opened our minds a bit more and helped us in creative ideation. 

The challenge at hand for me is to come up with a strategy of what will form the content of my website and how I will structure it. For the ideation of the website, I will reflect on my learnings from the workshop and do several rounds of sketches and put ideas on simple paper for the layout of the website. 

Implementation 

After the brainstorming and ideation phase, now it will be time to bring the ideas to a tangible form so they can be tested on real users for the testing stage. This is crucial in maintaining a user-centric approach. As this will be the design phase for my website, depending upon the content I create I will come up with information architecture and a sitemap for the website. After that I will define main user flows based on user stories defining some tasks to be performed by the user examples of this could be ‘user should be able to navigate to all the modules’ and ‘user should be able to access detailed version of each module. Once the content and structure of the site is laid out I will be able to design a basic wireframe. 

Wireframes can range from very low-fidelity quick mockups to black-and-white digital frames to high-fidelity interactive designs. I will focus on creating black and white wireframes using Figma with text only and have it tested by a group of users the goal here would be to figure out if the most important element of the website i.e the mighty content; fulfills my project’s aim. This stage can potentially have a back-and-forth between designing, getting feedback and going back to design phase and making changes accordingly. 

Usability testing

Usability testing is the practice of testing how easy a design is to use with a group of representative users. It usually involves observing users as they attempt to complete tasks and can be done for different types of designs. It is often conducted repeatedly, from early development until a product’s release.

“Pay attention to what users do, not what they say.”

Jakob Nielsen

My chief objectives for usability testing would be to:

• Determine if user can complete tasks successfully and independently 
• Assess their performance and mental state as they try to complete tasks, to see how well my design works.
• See if there is element of delight present i.e how much user enjoys completing a task
• Identify any problems and their severity 
• Find solutions and re-iterate 

There are several methods for usability testing:

In-person testing: In this method a set of tasks is provided to the user to be completed infront of the moderator.

Remote testing: Catching users in their own environments can reveal more-accurate “filed” insights.

Guerrilla testing: Testing design informally on fellows/colleagues; risks include inaccurate data. 

 Web-Accessibility

Web accessibility is the practice of making websites usable for all visitors, including those with disabilities, impairments and limitations. Web accessibility involves following certain design principles which ensure that people who experience difficulties or limitations have the same or similar experience as those who do not. Accessibility is an important goal for websites, as it gives all users equal access to the content. When we design a website with accessibility in mind we can ensure user-friendliness on the whole for example considering the use of captions on a video for people with auditory difficulty can ensure ease of use for a person who happens not to have earphones or they are in a crowded space but still want to follow the content. 

To ensure the accessibility of my website I aim to follow the guidelines by Web Content Accessibility Guidelines (WCAG) by ensuring the content and the website is perceivable, operable, understandable and robust. Web-accessibility can be achieved by providing alternative text, providing captions and transcripts for audio and video content, writing code in a meaningful way where the structure stays intact even if styling is removed and ensuring functionality via use of keyboard. 

Conclusion 

Lastly, this document has helped me develop a deeper understanding of User Experience Design and all its phases. The key learning is to use the various research methods to get to know the user as best as I can and always keep an iterative approach to design. 

Citations

Maze. (2022). The Ultimate Guide to UX Research. https://maze.co/guides/ux-research/ 

LinkedIn. (2015). Defining UX Research Objectives. https://www.linkedin.com/pulse/defining-ux-research-objectives-zornitza-yovcheva/

Dam, R. (2019). 5 Stages in the Design Thinking Process.The Interaction Design Foundation. https://www.interaction-design.org/literature/article/5-stages-in-the-design-thinking-process 

Welcome to my post about three objects from my daily life that I think are very well designed. Read below to find out why!