About Me

Hello! I am an interaction designer with over 6 years experience in design, and a background in Project Management in Digital Media.

I’ve been planning a career change and the time is finally now to pursue my true passion. I have been freelancing as a UI/UX designer on several projects during evenings and weekends and, I’m ready to turn my experience into a full-time career and collaborate with a team who truly values hard work and creativity.

As an interaction designer I feel my main interest is to utilize user research & results that have been collected and start from there to create clean, engaging, visual experiences for the consumer. I am also not afraid of a little code. But my true passion is improving the user experience through designing the usability of products and their aesthetic appeal.

Other Projects

I’ve always been interested in various forms of creative activities/hobbies, including: digital artwork, painting, crafting unique photo frames/wooden artwork/signs, and even upcycling an old cabinet into a cocktail bar. I speak native Latin American Spanish, English, and am learning Sign Language.

My other passions include typography, nature, and music (almost all genres - my favorite though is 90’s Alternate & Indie Rock). I love to sing in the car, dance to the beat in my seat, listen to audiobooks, travel/explore with my family, and eat anything with Nutella in it!

Contact Me

SMC Website Redesign

SMC Website Redesign
Project Overview

This project was completed as part of a class at Santa Monica College. My team and I were tasked to redesign the SMC (Santa Monica College) main website. The goal was to create a successful redesign by identifying the needs of the user and making it a truly enjoyable experience for them. This was done by implementing research, organizing content and applying the new branding being developed by an outside company and creating a responsive design.

Project Details:
  • Duration: 12 weeks
  • Team: 4 designers - Project Manager
  • My role: Competitive analysis, budgeting, UI design
  • Tools: Photoshop, Illustrator, Balsamiq, WordPress
  • Deliverable: High-fidelity interactive WordPress website

The Challenge

Can we consolidate and organize the endless
amount of data and information to create an
enjoyable experience for site visitors?

Mobile responsive SMC site

As a SMC student I visited the Santa Monica College website multiple times a semester and always found it difficult to navigate. Santa Monica College wanted to refresh their online presence and brand identity to promote the college’s unique approach and vision to a global audience. Additionally SMC wanted to promote specific content to different interested parties: the community, alumni, faculty and new students. The long term goal for the redesign was for the site to be easy to update and to be designed with mobile first in mind. A full redesign of the website was part of a class project where I worked as a team leader in a group of four designers.

What I did specifically
  • Team Leader
  • Client Survey
  • Competitive Analysis
  • Personas
  • Communication/Project Brief
  • Estimate + Schedule
  • Sitemap
  • Sketches
  • Wireframes: Homepage + Landing page
  • Design Comps
  • WordPress Site (3 pages)
Client Survey

During our client survey we discovered that the main reason for the redesign was that the site was not responsive, outdated and was not competitive against the other Community Colleges in the area. The goals for the new site was for it to be engaging, forward thinking, and innovative while maintaining the new branding created by an outside design firm.

Competitive Analysis

We performed a competitive analysis of the other community colleges in the Greater Los Angeles Area. Most community colleges offered unique content targeted to specific audiences. SMC mostly targets the international community of students. We used Xtensio to make this process easier.

Target Audience & Personas
  • Target Audience: Students, International Students, Faculty, Employees, Professors, Alumni, Community Members, Potential Students. Students Age Range 18-28, others range from 40-55 year olds.
  • Amount of time spent on site: Research from the SMC Site Administrator shows that a typical session for a user is 15 minutes, they search the site for needed information.
  • Device site is accessed on: Most visitors are using their smartphones to access the site. Income is in the low to medium range.

Site Map

As an independent assignment I analyzed the current SMC site and created a sketch of the site map first, I rearranged the navigation to make more sense and renamed any confusing nomenclature. Then I began organizing and removing any unnecessary links and redundancies. The final solution was six categories in addition to the homepage. Each category on average would feature 4-6 pages.


Having an overall idea of the direction for the redesign I began creating wireframes for the three breakpoints, mobile, tablet and desktop. I considered the primary goals and the audience for the site. Mobile pages should only include the important content of a site in an easily viewable layout meant for a small device. I focused on three sections, for the homepage the first section contained the logo, below that, I placed the navigation menu in accordion style dropdown and a search bar.

In the second section the jumbotron slideshow with details on the images about events, programs, or other information that needed to be highlighted. The last section was for a news section with an image and the text column to the right of that. For the second page, the admissions page the first section was consistent with the layout of the homepage, we added three icons in the second section that represented three steps to apply for admission, in the third section we added a paragraph overview. We used Balsamiq to wireframe more easily in this process.

Design Comps

For the design comp, I worked on two pages in three sizes to give the new SMC a new look. I started the visual design for the pages by creating a complementary color scheme to go with the revised logo. I chose a sky blue that complements the orange in the logo perfectly and as SMC is so close to Santa Monica Beach, the blue represents the ocean. For the typography we chose a standard font that would read well on all devices, we chose Helvetica in Regular and used the Helvetica font family throughout the design. For the homepage we chose a large image of the campus with three sections with icons known as the "call-to-action". These are the main focus of the college for students to be able to "apply now" a section for "new students" and a section for "current students." The team chose my design and we proceeded to make adjustments to all of the pages to reflect this design direction.

Creating the WordPress Site

We purchased a WordPress theme that was geared towards education. We split the work into 3 pages each totaling 12 pages for the high fidelity prototype. The end result was a site with a clear navigation system, a successful sub-navigation system, a strong visual design.

As project manager, I performed a test on all of the pages to ensure quality, branding cohesiveness and functionality. It took about eight weeks to complete the site prototype with 12 functioning pages. We presented the site to the SMC stakeholders and they were very please with the outcome.


In conclusion, this project was an overall success for all parties involved. As a team we successfully redesigned the site and created a responsive website for our client.

In the end the project satisfied the users' end goal which was to have access to a mobile friendly site with clear, well-organized content. The stakeholders' end goals of increasing the visibility of the college and maintaining its status as the #1 transfer college to and remain competitive in the market were also met.

SMC home page on iMac
Close Project

Truck Line Cutter

This page is still under construction

Project Overview

This project involved finding a solution to a daily problem most hungry food truck seekers face, waiting in long lines for gourmet food trucks. My team and I were tasked to conduct research, identify and solve this problem in the food truck ordering experience. While we kept this customer focused goal in mind, we were also highly focused on boosting revenue for the gourmet food truck owners.

Our solution was to eliminate the lines altogether by providing food truck seekers the ability to look up locations of nearby trucks, view their menus, food images, yelp reviews, and quickly place an order all through our app. Once the order was fulfilled, the user of the app would be notified when the food was ready for pick-up. This was done by implementing an end-to-end design process.

Concept Summary

There’s no shortage of apps designed to allow to you order-in from restaurants for pick-up or delivery. But I couldn't find any on the market that service food trucks.Truck Line Cutter App is a concept that was created to solve one of the biggest pain points in most hungry people's lives, waiting in line at a popular gourmet food truck to order food. The Goal of Truck Line Cutter "TLC" was to be able to look up a food truck by name, location, cuisine or scan a truck at your existing location, then view the menu, place an order and avoid waiting in line to pick up the delicious food. Most events now feature food trucks and they always have long lines and this app would be such a time saver.

Project Details:
  • Duration: 16 weeks
  • Team: Four designers: Mavi Laidlaw Designer and others
  • My role: Team Leader, Concept, Low Fidelity Prototype, Sketches, UI Design, Visual Pattern Design, Branding, High Fidelity Prototype
  • Tools: Marvel App, Photoshop, Sketch, InVision and Prezi
  • Deliverable:High-fidelity interactive prototype
What I did specifically
  • Conducting initial interviews with gourmet food truck customers and employees
  • Competitive analysis
  • Initial brainstorming through sketching and wireframing
  • Creating user flows
  • Owning design of all screens
  • Fine adjustments post usability testing
  • Creation of the High Fidelity Prototype

The Challenge:

How can we transform the way customers feel when they interact
with gourmet food trucks by removing their frustration
with waiting in line to order?

Introducing Truck Line Cutter

TLC Introduction Mobile App

Research Phase

Competitive Analysis

To begin my competitive analysis I searched the Apple & Android App Stores for any food truck related apps, and at the time the only thing closely related were locator apps that pulled a twitter feed into them showing you the trucks location based on their tweets.


The next step was for us to gather real-time data from real customers, we visited a popular truck stop and we began by talking to real people waiting in line, and asked them how they felt about their experience when they waited in line. What aspect was most frustrating for them? The time wasted, the physical act of standing, boredom?

Key findings from this visit:
  • The majority of customers in this location are employees of the nearby businesses and they’re hungry looking for a quick option on their lunch break.
  • The time wasted waiting for those on their lunch break was used just to wait in line to order food and then they waited once again for the food to be prepared.
  • Ordering lines could get long during lunch time and the hungry customers became hangry.

These findings led us to start thinking about taking the solution in a direction that would eliminate the time spent waiting to order, as well as exploring ways to improve upon the experiences of traditional point of sale.

TLC - Interviews
User Persona

The user persona was created from the combined key findings from my teams surveys, interviews and research. This persona is meant to represent how a typical user of the product may think and behave.

TLC - Persona
User Flow and Wireframes

We met to discuss the app in detail to create flow charts from the sitemap made of post-its. We evaluated the visual sitemap and all of the possibilities for the screens that were necessary depending on where the user clicked. First, we identified the necessary information from the low fidelity prototype and sketches.

In example: Search screen, Shopping cart or Checkout screen, then we visualized all of the information and their functions. Mobile design is not a linear navigation process, with mobile there is always more than one way of getting to the same result, plus other options, menus, etc.

TLC - Wireframes
TLC - User Flow

After sketching out a full user flow on paper, I began working on the low fidelity prototype to test out that the user flow was accurate plus it could be used to receive preliminary user feedback.

TLC - Sketches of the app part 1
Low Fidelity Prototype (POP)

I created a quick prototype in POP to share with the team

TLC - POP (Prototype on Paper) Screenshot

Design Phase

User Interface - Design Patterns

With the research step complete, the problem clearly defined and the persona and user flow established, we started to formulate design concepts by individually brainstorming and researching our ideas, then reconvening to discuss what we came up with and combine our best ideas.

Interactions with the Food Truck:
  1. Camera Controller to scan a QR Code that would be on the participating trucks
  2. Checkout page to purchase the food
  3. Sign-in and Sign-up pages to save user data for upcoming purchases
  4. Location GPS to search for trucks based on users active location, zip code
  5. Maps to view the location of the food trucks
  6. Detailed Views of the food
  7. Sharing on Social Media
TLC - Design Patterns

High Fidelity Prototype v1

Once the design pattern research was complete we began sketching out the final concept for the high fidelity prototype, then creating a quick high fidelity version of the screens for a user testing session. We decided to focus our prototype on one food truck to, the Kogi Truck it is legendary in Los Angeles for the delicious Korean Mexican Fusion food. We used their real menus and images for the prototype.

TLC - High Fidelity Prototype
User Testing

We were able to conduct preliminary user testing to get feedback on the 12 screens and the user flow. The most important pieces of feedback received were:

  1. Final Splash Screen:some users wished the text on the final screen mentioned that they would be receiving a confirmation email and status updates
  2. Updating the Credit Card entry section as it was repetitive
  3. There were too many Social Media buttons on the final screen
  4. The bookmarks button was not intuitive and therefore it was difficult to find
TLC User Testing
High Fidelity Prototype v2

Taking all of the feedback received into account, I resumed ideating with a critical eye analyzing every screen for alignment, padding, or sizing issues. I made improvements to maximize effective communication and logical visual choices.

The following is an example of the different iterations that were created and the changes we made as a result of the noted feedback.

  1. Near me map icons changed from trucks to pins
  2. Text size increased
  3. Selecting the Kogi truck directs to detailed view
  4. Detailed view was expanded and redesigned
  5. Shopping cart and checkout pages were redesigned

Insert image here

App Icon Revised

The App Icon also received a makeover, originally the main idea for the app icon was to create a cross between a pair of scissors, a fork and a knife. We continued the original idea but through multiple ideations.

Insert image here

Final Designs

Invision - High Fidelity Prototype

This is a walkthrough of highlights of the final mockup, starting with a full demo video and ending with an interactive clickable prototype.

TLC High-fidelity Prototype checkout flow


The first thing that users will see is a welcome screen they are prompted to create an account, but are also presented with the options to sign in or continue as a guest.

Home Screen

Following this, the user is directed to the search page and is able to proceed with three options for courses of action:search by location, by cuisine, by Truck Name A-Z.

Browse the truck menu

If the user selects search by location, they will receive a list of food trucks that are currently open and accepting orders near them. The user can then select their food truck of choice and browses the menu. Once the user decides which items they would like to order they add the items to the shopping cart.

TLC High-fidelity animated gif
TLC High-fidelity animated gif
TLC High-fidelity animated gif
Checkout Flow

All of the user flows end with checkout. This design demonstrates how a user would check out using a Credit Card because it is likely the most convenient, but other options available are Google Wallet and Paypal. Immediately after payment, the user is shown a purchase summary stating an email confirmation has been sent and informing the customer of when the order will be ready for pick up.

Insert animated gif here


Cheesy grin jarlsberg stinking bishop. Smelly cheese squirty cheese everyone loves cheese strings everyone loves babybel ricotta cheesecake. Cheese on toast pepper jack airedale pepper jack cheesecake croque monsieur cheesy feet cheeseburger. Emmental boursin cheese on toast cheese triangles emmental cauliflower cheese monterey jack fromage frais. Dolcelatte red

leicester emmental cheese slices caerphilly squirty cheese hard cheese brie. Cheese slices emmental red leicester stinking bishop taleggio everyone loves stinking bishop say cheese. Monterey jack everyone loves queso dolcelatte manchego emmental macaroni cheese blue castello. Ricotta cheesy feet chalk and cheese paneer danish fontina roquefort halloumi.

Close Project

OLA Mexican Kitchen

OLA Mexican Kitchen - Tequila Rolodex
Project Overview

This project involved creating an app that would work like a rolodex, but with tequila, with a list of all of their available products for tasting while giving the user the experience of logging their favorites, sharing with friends and viewing purchase information. OLA Mexican Kitchen are known for having the largest variety of tequilas in the region, and often host tequila tasting events. My team and I were tasked to improve the customer experience in the restaurant by boosting tequila sales.

This was done by ensuring the basic restaurant information was displayed, that the UI design be intuitive, clean and functional.

Target Audience: Food lovers, tequila enthusiasts, couples, singles, college graduates, income of 50k+, ages 25 - 55. Upon completion the app was made available on the Apple App and Google Play Stores.

Project Details:
  • Duration: 4 months
  • Team: Mavi Laidlaw Designer and others
  • My role: UX research, sketches, design, usability testing, visual designer
  • Tools: Sketch, InVision, Photoshop, Illustrator
  • Deliverable: Live App
What I did specifically
  • Initial brainstorming through sketching and wireframing
  • Creating user flows
  • UI Design
  • Usability testing post development
  • Fine adjustment fixes
  • Communicating details to developers

The Challenge:

How can we create a better
tequila tasting experience for
customers of OLA Mexican Kitchen?

Introducing OLA Mexican Kitchen

OLA Introduction Mobile App

Research Phase


When I think tequila, freshly cut limes, salt and shot glasses come to mind. When I think huntington beach pier, I think of the sunset, plus the logo has the colors of the sunset in it, this makes up the moodboard.

OLA Mexican Kitchen - Moodboard


I started to formulate design concepts by brainstorming and sketching out ideas, then my team and I discussed the ideas and refined them. We decided to move forward so I started with the sign-in, sign-up screen solutions. And I added notes for the developers for pop-up notifications we should include as a (Call to action)

for the users. Then I continued sketching the remaining screens, the category view listing out the tequila types. Product views in list and grid view. The side navigation, customer profile screen, About us sections and post splash screen home page views.

OLA Mexican Kitchen - Sketches of the app part 1
OLA Mexican Kitchen - Sketches of the app part 2

Low Fidelity Prototype (POP)

I created a quick prototype in POP to share with the team

OLA Mexican Kitchen - POP (Prototype on Paper) Screenshot


Once the sketches were approved I began wireframing the login screens so that the developers could advise if they could apply the functionality.

OLA Mexican Kitchen - Wireframes

Design Patterns

I sent the client a few design patterns in wireframe form for the design solutions should be. I sent them:

  • Sign-in/sign-up
  • Walkthroughs to introduce the app
  • Mobile E-Commerce for the products and different views
  • Filter

They approved all of these ideas except for the filter as this was too complicated for the first version of the design. I started working on a few visual design patterns and shared those ideas with the team, they liked the direction this was heading in.

OLA Mexican
                  Kitchen - Design Patterns

Design Phase

Designed Screens - Sign-in Process

I used the wireframes as a guide for the design of the sign-in screens, adding in the branding colors, logo and details needed to make the screens be a great user experience.

OLA Mexican
                  Kitchen - Sign-in screens

App Icon

The Restaurant already had an established brand that they wanted to use this as the app icon so designing the app icon was not difficult I just played with the colors and thickness of the circle in the logo itself.

Visual Design

Category View
  • Images of headlines
  • Silver
  • Reposado
  • Añejo
  • Mezcal
Home Screen View
  • Navigation Tab Bar
  • Home - Overview of the Restaurant
  • Image of the Restaurant
  • Address & Map
  • Contact & Website Info
  • About
  • Menu Bar
OLA Mexican Kitchen - Visual Design

UX Flowchart

Once I completed the design of all of the screens I sent the development team a UX Flowchart so they knew how to correctly build the app.

Products List View
  • Search
  • List of Products in three columns
  • Image of shot glass
  • Name of product
  • Rating system below it
  • Favorite hearts (select/deselect)
Favorites View
  • Can switch between grid & list view
  • Search
  • Display of favorite items
Side Menu View
  • Name (Icon)
  • Home
  • Profile
  • Favorites
  • Logout
Profile View
  • Name (Icon)
  • Fields for Customer information
  • Change Password (button)
  • Update Profile (button)
OLA Mexican Kitchen - UX Flowchart

UX Bug Fixes

The development process began, they created a test app and uploaded it to a test site of the google play store where I downloaded the app and evaluated each screen. I began documenting and taking screenshots of the issues for the developers to fix. Multiple bug fixes later the app was live on both the Google and Apple App Stores.

OLA Mexican Kitchen - UX Bug Fixes


During this project I learned a lot about workind directly with a development team to launch an app live. Instead of designing from scratch I started with a template that the developers had chosen. Luckily having some coding experience I found it more easy to express the issues that arose during the testing phase.

The turnaround time was much more rushed than I expected but overall from start to launch it took a few months, I'm glad we had the time to test before the app could launch on the Apple Store to fix the bugs and iron out all of the details. Here's the proof that this app was launched and was live on the app store in 2015, however as of 2018 the restaurant decided to no longer use the tequila rolodex.

Close Project

Tolly's Treatments

Tolly's Treatments Hero image
Project Overview

This project involved rebranding the logo and product label design for Tolly’s Treatments, a company that makes all natural home and body products using high grade essential oils. I was initially consulted to perform a facelift on the website, but after performing a quick analysis of the products I identified the problem.

The packaging design wasn’t aligning with the needs of the target audience. Once the problem was solved I was able to help Tolly’s Treatments boost their sales by 235%.

Project Details:
  • Duration: 6 months
  • Team: Mavi Laidlaw Designer
  • My role: Branding, Visual Design, Packaging Design
  • Tools: Illustrator, Notebook and a Pen
  • Deliverable: All branding assets including, logo, brand board containing fonts, colors, and the completed labels.
What I did specifically:
  • Conducted interviews
  • Market Research
  • Competitive Analysis
  • Visual Design
  • Branding including a Logo redesign
  • Packaging ReDesign for 22 products in multiple shapes and sizes for a total of 28 labels.

The Challenge:

How can we increase sales for a small business by changing
the way a target market perceives their product?

Introducing the new Tolly’s Treatments


Research Phase


At the beginning of the project I met with the client (the owner of Tolly’s Treatments) to collect their goals for the new logo and redesign of the packaging labels.

Design to be kept: The logo appearance should appear the to be similar, they wanted to keep the same look which was a thick chunky font. No curve or angle, a black color and all products in the line would have a color variation but be consistent with other lines in the same primary color set.

The goal: Convey a feeling of calm, relaxation and love.

Changes wanted: Simple, clean, bold, they were interested in having illustrative patterns such as fruit or images of the ingredients on the labels.

Future goals: Overall they wanted the new design to be fun, luxurious but not pretentious with the ultimate goal aside from increasing sales was to be sold in Nordstrom one day.

Market Research

Since the future goal is to be sold in Nordstrom Stores, I performed my Market Research there, I evaluated full lines of products in a multiple spectrum of designs.

Competitive Analysis

Target audience: 20 - 55, female, mid-level to upper class, with knowledge of toxicity in products.

Direct competitors:

  1. Twig + Petal
  2. LA Bruket
  3. Baija
  4. Farmaervas

The things they have in common are they all have similar ingredients, the design is clean, basic, the label contains alot of white space.

Old Design Analysis

The logo and packaging design were originally created by the client. The logo was set in a typewriter font in all caps with a drop shadow. On the label it was taking up 35% of the real estate, there was a total of five unique fonts on one label. In one example, the description of the product for the airspray product

Love was Geranium is peaceful, "Ylang Ylang is an aphrodisiac”. However during my product analysis, the label lacked those qualities of romance. The other thing I noticed was that The lip balms, rollers and air sprays were all designed differently and the descriptions used were also inconsistent.

“Tolly’s Tolly's Treatments Old Body Products image 2

I searched for illustrative images of all of their ingredients, such as lavender, blood orange, lemon, geranium. Despite the clients desire for a masculine feel I knew the target audience was mostly female and I wanted to attract them so I went for a more feminine vibe but with plenty of white space.


Visual Design

Sketching for Branding

I sketched ideas with elements of eucalyptus, a flower or anything to give the name Tolly's Treatments the identity that it is an aromatherapy company. We went through multiples rounds of iterations for the logo but nothing was resonating with the new look the client wanted.

I tried a combination of fonts from something that looked like their previous logo to serif, bulky sans serif, then cursive, handwritten fonts and still nothing hit the nail on the head. I suggested that we move the project along by working on the designs for the labels then placing a few of their logo top choices into the final label design.

Sketching for Packaging

I brainstormed an idea of including an illustrative element into the label, I started sketching and playing with lemon slices, eucalyptus leaves, blood oranges and then I played with the text direction of the label headlines on a few designs.

Design Comps for Logos

Once we settled on the background pattern I inserted their top logo choices. None were seeming like the right choice. I finally found a cursive font that was feminine and I thought looked great with the word “Tolly’s”.

I sent them this font for review and the client immediately rejoiced and said I love it, I think it’s perfect! I manipulated the font a bit in illustrator with some minor tweaks here and there and the final logo was set.

Design Comps for Packaging Labels

I scoured the web for free illustrations of natural elements I found an amazing line illustration curved pack. Out of this I chose a select few flowers and leaf combinations to create my own pattern and repeated it as a background on the label. The client loved this and was it was the first step in the right direction for the label design.My next goal of this redesign was to minimize the amount of fonts used on the package.

Their previous design had five different fonts. I used three fonts including the logo. I wanted the fonts to evoke the feelings listed on the label, for example Love I wanted it to be a feminine thin and mildly cursive font. I chose to update the color border by bracketing in the “Blend” and this way all of the product lines were tied together with similar design.

New and improved product design

The client really liked the idea having one line printed on metallic, the client decided to have the face masks with this luxurious metallic look. I suggested we have the label background as black this brought a sense of exclusivity and elegance to this line.

After a few rounds of printing, re-iterating and resizing to ensure all of the content fit on the product the labels were ready for the printer, they were all professionally printed and applied to the products.

Before and After - LOVE Comparison
Branding materials

I recently created a double sided postcard for Tolly's for them to use in P2P marketing.


Tolly’s Treatments launched their new line on their Website and Etsy store and began selling around town on the weekends at flea markets. Their sales have increased by 235% and they attribute their success to the new design. Pictured here is the owner of Tolly's Mandi Tollefson selling at the Rose Bowl Flea Market, hanging behind is a banner I designed for her and all of the new products. I thoroughly enjoyed this project and working with her as a client and I will hopefully be assisting her again soon with a new product line that is being developed.

Close Project

Early Bird

Early Bird morning alarm docking system

Details coming soon!

Close Project

Other Projects

Other Projects

Details coming soon!

Close Project