For our Digital Technology and Design module, my team and I were tasked with creating a website for a fictional society using Wix. Our society was called the 'Smurfit Nutrition Studio'.
Process:
Step 1: Researched existing student run nutrition societies for inspiration. Audited those that acted as examples of good and bad website design. Held a brainstorming session and decided on menu headings, CTA and content ideas.
Step 2: Agreed on the site’s theme, colour scheme and designed a logo to ensure that the site was designed coherently.
Step 3: Designed wireframes by hand-drawing and then using tools such as Microsoft PowerPoint and Balsamiq.
Website Purpose:
This website is intended to act as a hub for all things Smurfit Nutrition Studio. Hence, it’s key purposes are to:
● Engender an appreciation and enjoyment of healthy eating, no matter what the student’s lifestyle, dietary requirements or budget is.
● Provide students with:
- Recipes, blog posts and information about upcoming events and dietary requirements.
- Content (mix of imagery, text and video) in the form of featured guest bloggers, cooking demonstrations, tastings and talks from industry chefs and nutritionists, that members can register for.
- A brief history of the society and introduction of its committee members. - Links to social media platforms - Instagram, Youtube, Facebook, Twitter & Pinterest.
● Allow users to subscribe to a monthly newsletter, contact the society or become a member.
● Allow members to register for events.
Plugins Used:
1. Wix Forms: Used for newsletter subscription on “Home” and “About” page. Also used for event registration on “Register” page and contact form on “Contact” page.
3. Instagram Feed: Used to display Instagram feed on “Home” page.
4. Form Builder and Payments: Used to take membership payment via PayPal on “Join Now” page.
5. Wix Blog: Used to publish blog posts and recipes.
6. YouTube Videos: Added to diets pages to give more in-depth information.
Website Functionality:
Clearly delineated header, which houses the main menu and the logo. Clicking the logo brings the user to the home page, while hovering over the menu displays the relevant sub-menu. Furthermore, this menu is present on each page, allowing the user to navigate from page to page with ease.
The primary CTA (“Join Now”) is clearly displayed under the header and on the footer of each page. It is also displayed in the centre of the homepage (before the fold).
The homepage is laid out in a grid style format for ease of use. Images and buttons are optimised for screen readers (site-wide). Social media links for accessibility.
Utilised external links to outside websites and internal hyperlinks. Descriptive text used for hyperlinks to ensure that the user is aware of where the link is taking them. Clickable images used in blog posts (e.g. Foodie Online Courses post) linking to outside websites for clear navigation. Additionally, all images were compressed to ensure optimal functionality.
UX Layout/Design for Usability:
Responsive design used to optimise display on both desktop and mobile view.