Sarah Loh

Frontend Developer / Designer

Personal Info

Name:

Sarah Loh

Address:

Tipperary, Ireland

A skilled Developer / Designer with a broad range of technical experience that I bring to every project. I work quickly and effectively with proven ability to manage priorities and workload across various projects. An excellent communicator who thrives in bright and enthusiastic teams and a self starter when working solo.

Comfortable working as part of a cross functional team in both design and development roles. Familiar with Agile, Scrum, Lean and Kanban methodologies. Completed training in Technical Project Management.

Projects

Website screenshot

Clonmel Laptop Ensemble

Video projection and graphic design for the live coding ensemble.

Video

Website screenshot

Destination Anywhere

Frontend Single Page Application using Google Maps API.

Website GitHub UX

Website screenshot

Online Cookbook

Data-driven online recipes app built with MongoDB, Flask and Bootstrap.

GitHub UX

Website screenshot

Hobbit Riddle Game

Logic-driven Application using Python and Flask.

Website GitHub

Destination Anywhere

Website GitHub

Wireframes

Wireframe Wireframe Wireframe Wireframe

UX Design

Strategy
Focus User Needs Business Objectives
What are you aiming to achieve? Select a destination city Increase brand awareness
Find tourist attractions Increase social media following
For whom? Find accommodation
TARGET AUDIENCE - Adults Find bars and restaurants
Scope
Focus Functional Specification Content Requirements
Which features? Explore - View cities list by country View cities by country
Navigate - Use the map to discover cities Select city from dropdown
What's on the table? Discover - Browse attractions, accommodation and restaurants Type city name into search box
Weather - View current weather data Navigate to and select city using map
Toggle tourist attractions, accommodation, bars and reataurants markers
Display image and information for each venue
Display images and information for city
Display weather charts
Structure
Focus Interaction Design Information Architecture
How is the information structured? Where am I? / How did I get here? / What can I do here? / Where can I go? Organizational / Navigational schemas (tree / nested list / hub and spoke / dashboard)
Explore > Navigate > Discover > Venue Tree
How is it logically grouped? Mobile: Buttons and chevron arrows move between various sections
Tablet and Desktop: Click to sections
Skeleton
Focus Interface Design Navigational Design
How will the information be represented? See wireframes Explore > Navigate > Discover > Venue
How will the user navigate to the information and features?
Surface
Focus Visual Design
What will the finished product look like?
What colours, typography and design elements will be used? @import url('https://fonts.googleapis.com/css?family=Montserrat:300,600|Open+Sans');

Online Cookbook

GitHub

Wireframes

Wireframe Wireframe Wireframe

UX Design

Strategy
Focus User Needs
What are you aiming to achieve? I want to store and access cooking recipes
I want to find recipes for a particular cuisine, ingredient, country
I want to see the most popular recipes
I want to add a new recipe
I want to view existing recipes
I want to edit a recipe
I want to remove an old recipe
I want to create an account to keep track of my recipes and favourites
Scope
Focus Functional Specification Content Requirements
Which features? View all recipes ordered by number of favourites See database schema
What's on the table? View all recipes using filters
Add a new recipe
View a recipe
Edit a recipe
Delete a recipe
Create an account
Log in/out
Sign up
View a user profile page
Favourite a recipe
Unfavourite a recipe
Structure
Focus Interaction Design Information Architecture
How is the information structured? Where am I? / How did I get here? / What can I do here? / Where can I go? Organizational/Navigational schema (tree/nested list/hub and spoke/dashboard)
Favourite a recipe by clicking heart icon, prompt to log in if not Tree structure
How is it logically grouped? Log in by entering username in a form Home
If you don't have a username, prompt to sign up Recipe
Sign up by registering a unique username in a form Manage Recipes
Click on Manage Recipes to view user profile page - Add Recipe
Add and remove filters to alter recipe list displayed - Edit Recipe
Use pagination to view recipe list Log In/Sign Up
Click on a recipe to view it in full
Scroll through recipe page to view recipe content
Update and delete recipes from by clicking on icons on Manage Recipes
Unfavourite a recipe by clicking the heart icon
Log out by clicking the log out icon
Skeleton
Focus Interface Design Navigational Design
How will the information be represented? See wireframes All Recipes
Manage Recipes
How will the user navigate Add Recipe
to the information and features? Most Popular
(Log In / Log Out)

Database Schema

Recipe
{
    name: '',
    time: {
        hours: Number,
        minutes: Number
    },
    author: UserId,
    description: '',
    ingredients: [''],
    method: [''],
    image_url: '',
    date_added: Date,
    favourites: Number,
    cuisine: '',
    type: ''
}
User
{
    name: '',
    username: '',
    my_recipes: [RecipeId],
    favourite_recipes: [RecipeId]
}