PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit...

49

Transcript of PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit...

Page 1: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was
Page 2: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

2

I am a woman of color that has seen first hand the effects

of design not connecting for the intended audience.

Diverse design solutions that adapt to the evolving needs

of society is crucial for the future of the field. One modern

solution tailored to an “ideal” audience does not connect

to the real-world environment it is being placed in. With

my background in Industrial and Communication Design

I aim to bring an underrepresented perspective to the

design community. Because of my interest in how the end-

product interacts with its users I am interested in working

in UX, UI design, environmental design, product design,

and packaging design. There is no one modern solution for

every problem and I believe a holistic approach to design is

instrumental to its success.

I utilize research development of personas, case studies

and data collection to a variety of design solutions. I

practice a thorough conceptual process of sketching and

technical drawings as a tool for exploration. I believe a

tactile approach to design leads to a better realized end

result that has a stronger impact to its intended audience.

4 ............................................................. PowerUp

14. ............................................................. Date IQ

23 .......................................................CitizenWolf

35 .................................................................KONG

46 .......................................Beginner Builder Kit

54 ................................................................ ProPin

68 ..........................................Colocha Curl Care

80 .........................................Colocha Exhibition

I believe that everyone should have access to design in

the similar manner that William Morris believed everyone

should have access to quality design through the Arts and

Crafts movement. A formula for modernization should not

be presumed to work in every instance, and marginalized

communities are in the constant receiving end of this

forced modern design that does not reflect their needs or

budget. I appreciate Morris’s enthusiasm for providing high

quality art to all classes, however there needs to be careful

research on audience needs. Through careful research,

exploration, prototyping, and visual realization design can

become accessible adaptable to audience needs. With my

diverse background and skill set I aim to bring a variety of

design solutions for complex problems.

Page 3: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

54

PowerUpResponsive Web Design

In this project was tasked with creating a website

for a small company that recently raised funds

through KickStarter. This hypothetical redesign

would serve as an approach to how PowerUp

Toys would use the funds to improve their website

for the product/service fundraised. However,

after researching PowerUp Toys I found that their

current website was difficult to navigate and

showcase the new product.

Landing page responsive redesign.

Project 1 | PowerUp

Page 4: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

76

After researching PowerUp Toys I found that their

current website was difficult to navigate and would

not allow for their intended audience to find the

new product. Upon searching for their available

products they mildly categorized with the majority

of their products being placed in hidden areas

of the site. In addition, their branding was not

consistent throughout the site.

(Left) Screenshot of PowerUp Toys “Shop” section of website.

Problem IdentificationWhen clicking on the store tab it would show the limited options in the “catalogue/front page” web page. Upon further investigation I found that there is much more products than what is immediately

accessible through the default site.

(Left) Screenshots of PowerUp Toys website showcasing the difference in visibility of products depending on site navigation.

PowerUp | Original Design Critique

Page 5: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

98

When redesigning the website with a variety of

products, I carefully crafted a modular system of

rows that could be duplicated in code to allow for

adaptability for new products to be added.

(Left) Designed modular system layout. Created in Sketch.

Redesign Process

PowerUp | Process

Page 6: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

1110

The final design was a two page (landing and

interior page) responsive website suitable for

desktop, tablet, and mobile. I categorized and

condensed the needs of the user by focusing on

educating what the actual products are, how it

work and where to purchase them.

The landing page contains a simple full width

block system that displays a video advertising the

new PowerUp 4.0, followed by a graphic (found

on their KickStarter site) explaining how the

product works, and finally a display of their basic

models that the user can then click on for more

information and purchasing options.

The interior page has the same structure with

the bottom section containing a rows of product

information categorized by model and function.

Hypothetical Redesign

(Above) Final responsive UI with a drop down hamburger naviga-tion menu, button with show hide feature displaying additional information on the products.

PowerUp | Final Design

Page 7: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

1312

Final Responsive Design for Interior Page

PowerUp | Final Design

Page 8: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

1514

Date IQBranding, UI, UX

Date IQ was a hypothetical app development

project made for academic purposes that required

students to develop design from a select theme.

Date IQ was the pre-established name described

as being a dating app for intellectuals.

Project 2 | Date IQ

Page 9: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

1716

(Left) 3 personas crafted from research on dating app. Drawn illustrations.

(Above) Logo Development

TECHIE

SOCIALITE

ENTREPRENEURAge: 50-60

Interests: Hiking, sports, finance, education

Background: Active adult, worked his way into the upper middle class and is now

looking to start his own business and investing in some start ups. Look-

ing for someone with drive and can keep up with him. Mid to high debt,

good credit, some higher education.

Age: 30-40

Interests: Beer, fashion, finance, family

Background: Single mother of two teenage sons. Grew up and lived in small town.

Was in a series of abusive relationships. Moved to the city and is studying

finance. Looking for someone compatible to her independent spirit. Mid

to high Debt, pursuing higher education.

Age: 20-30

Interests: Computer Science, Aerospace, Sci-fi

Background: Recent graduate and looking to find someone who shares interest and

education. Introvert, never really into a “serious” relationship. Low to

mid debt (wants to keep it that way), bad credit (overspending on tech),

higher education.

Date IQ | Process

Page 10: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

1918

(Above) UI Wireframes madeusing Adobe Illustrator

DateIQ | UI Development

Page 11: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

2120

UI DesignWith this dating app project, I used the pre-

established name of Date IQ as inspiration to

develop a scientific theme. When thinking about

the theme of an elevated dating app, I discovered

with a way that their various attributes could be

condensed and filtered through an algorithm that

would pair individuals using the app.

The periodic table was a launchpad for ideas

for grouping personality traits and background

information for users to easily filter through.

The app itself is heavily anchored in the needs of

the user. The persona development stage lead the

course of scenario mapping that was eventually

realized through UX and UI design. The final UI

specifically shows an example of the “Techie”

persona utilizing the app.

Given the periodic table inspired UI system, I wanted to create a vibrant interactive user flow. With each element describing what attribute that person used to describe themselves for instance Sc would be interested in science and Sp for sports and so on. Then each of the elements have a calibrated amount of compatibility with other elements that the algorithm cross-references to find an ideal match. (Above From Left to Right) Welcome, Profile, Match

DateIQ | Final Design

Page 12: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

2322

CitizenWolfAudrey Twigg, Eric Tofsted, Karen Ventura GascaBranding, Team Collaboration

CitizenWolf was conceptualized as a reaction

to the news of the Chinese Government using

facial tracking technology to punish their

citizens spotted in protests. This led to the team

brainstorming ways that this technology can be in

the hands of the citizens for protection.

CitizenWolf Ad Design & UI: Eric TofstedLogo Design: Audrey Twigg, Eric Tofsted, Karen Ventura GascaFinal Logo Rendering: Audrey Twigg

Project 3 | CitizenWolf

Page 13: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

2524

This project required careful research as our interest was in the user utilizing the app for self security. Here is the team gathered persona research.

(Left) CitizenWolf PersonasPhotography Source: UnsplashDesign & Copy: Audrey Twigg

(Above) Competitor Research for academic purposesDesign & Copy: Audrey Twigg

CitizenWolf | Research

Page 14: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

2726

CitizenWolf Logo SketchesKaren Ventura Gasca

CitizenWolf | Process

Page 15: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

2928

FACIAL RECOGNITION SECURITY

Logo Design: Audrey Twigg, Eric Tofsted, Karen Ventura GascaFinal Logo Rendering: Audrey Twigg

CitizenWolf Ad Design & UI: Eric Tofsted

CitizenWolf | Final Design

Page 16: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

3130

CitizenWolf Ad Design & UI: Eric TofstedContext: Karen Ventura Gasca

CitizenWolf Ad Design & UI: Eric TofstedLogo Design: Audrey Twigg, Eric Tofsted, Karen Ventura GascaFinal Logo Rendering: Audrey Twigg

CitizenWolf | Final Design

Page 17: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

3332

Brand & IdentityThe team wanted to focus on how to utilize this

new facial tracking technology as a weapon to

fight injustices. The power of the citizen was a

main objective and it became visually embodied

through the apps identity. The Wolf was a sign of

protection and power that the team developed

from a team brainstorming session. The need to

empower and protect the audience through this app

in combination with the iconography of the wolf

quickly materialized into a strong branding approach

using bright reds and bold typography.

This hypothetical branding project brought together

various components from the team members. Eric

Tofsted and Audrey Twigg were great collaborators.

In this project we all had a similar vision on what

the end product needed to be. We drafted our own

variations on the logo with Audrey Twigg designing

its final iteration and Eric Tofsted designing the final

UI and marketing materials. I designed the final brand

standard presentation and provided extra resources

and assets that the other team members used. I also

helped fill gaps in the process as well as kept the

team organized with tasks and file management.

CitizenWolf Ad Design & UI: Eric TofstedAdvertisement Context: Karen Ventura GascaLogo Design: Audrey Twigg, Eric Tofsted, Karen Ventura GascaFinal Logo Rendering: Audrey Twigg

CitizenWolf | Final Design

Page 18: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

3534

KONGBranding, Industrial Design

This was a class project to create a hypothetical

design for a new KONG dog toy. This initial concept

aims to promote behavior change for dogs with

excess energy and also helps resolve eating habits.

The final KONG toy concept holds treats or kibble

inside and requires the dog to dig or pull at the tabs

on top to release what is inside.

Final packaging rendering, Option 1.

Project 4 | KONG

Page 19: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

3736

Problem Solving/ResearchDogs with exponential energy often busy

themselves through a digging type of behavior,

whether that is digging through the sofa and

ripping out the stuffing or digging holes in the

backyard. I focused on this behavior as I alsohave this issue with my dog.

Before arriving through the final concept, I

experimented with a variety of chew toys and

explored variations on how to create a toy that

keeps the interest of the dog, but also benefits it

in some way (cleaning teeth, puzzle solving skills,

and others).

KONG | Research

Page 20: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

3938

When designing the dog toy, I wanted to create something that had an added benefit to the health of the dog. In this first in-stance I added grooves on the surface to act as a teeth cleaning element. The initial shape was a physical extension of the KONG logo mark itself, however as I pushed the capabilities of the toy I then separated the three sections that is then realized in the final mock up. (Above) Process Sketches for Concept 1 inspired from the Kong Logo

Ideation and Development

(Left Top) Concept 1 MockupCarved from Insulation Foam, Coated in White Gesso

(Left Bottom) Concept 1 Sketch Development

KONG: Concept 1

Page 21: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

4140

Concept 2 MockupsCarved from Styrofoam, Coated in White Gesso

For this concept I took inspiration from dog treats. Specifical-ly from pig ear dog treats. With this concept I took the organic shape of the pig ear and refined it to create a multi-functional dog toy treat dispenser and teeth cleaner. The ridges expanding out-side of the ear can be used as a surface to clean the dogs teeth. The ball inside can be filled with peanut butter that the dog can then entertain themselves to try to lick. (Above) Process Sketches for Concept 2 inspired from pig ear dog treats.

KONG: Concept 2

Page 22: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

4342

Concept 3 MockupsCarved from Styrofoam, Coated in White Gesso

KONG: Concept 3

Page 23: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

4544

(Above) Final concept scaling sketch and render.

The final design consists of a two parts, one

that holds the kibble or treats and the other that

features a series of tabs. These “tabs” or “slits” adds

a layer of difficulty to dogs with rushed eating

or over eating habits, and also helps dogs with

digging habits. The tabs allows for the scent to

come through and allows for the dog to release its

excess energy by playing with the toy, thus leading

to less desire to dig holes.

The final packaging design on the left shows

two approaches to utilizing the KONG branding

standards. The first image above is taken directly

from the KONG packaging brand standards, with

the use of appropriate type (or closest I had access

to) and use of proper CMYK colors for the different

informational components. The packaging

approach on the bottom is not an extension of

the brand with the packaging being a tag with the

logo name and bar code. This packaging design is

more realistic given the larger size of the product

itself being freestanding and might be too heavy to

hang as seen in the initial packaging design.

Hypothetical Product Design

KONG | Final Design

Page 24: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

4746

Branding, Identity, Packaging

In this project I was tasked with creating a toolkit,

and I wanted to create something in which I could

share my knowledge of Industrial Design through

what I learned with Communication Design.

I concepted a series of toolkits catered to a range

of ages and skill level. In this instance I created a

Beginner Builder Kit catered for ages 6-12 to learn

the basics of working with wood and plastic.

Beginner Builder Kit

Final packaging design of Beginner Builder Toolkit, view from back/bottom of packaging

Project 5 | Beginner Builder Kit

Page 25: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

4948

For this project I wanted to create a simple legible design with visual reference to blue prints.

(Left) Brand development, black and white, and color variation The final design tales visual cues from blueprints,

from the color and the lines creating a stencil like

look on the letters. The nesting of the letters echo

a bit of architecture as well as the alignment of the

title of the booklet on the bottom of the mark.

With this toolkit having a younger audience,

I created some characters to guide the user

through the kit. Bianca the Builder teaching about

materials and building processes, and Dave the

Drafter teaching how to properly prepare and

draw plans for a project.

Brand Development

Beginner Builder Kit | Process

Page 26: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

5150

(Left) Initial Toolkit Mockup

The initial toolkit design was created for a type

of suitcase container with the lid holding the

instructional booklet and the heavier tools in the

base of the kit. Because the nature of the toolkit is

a bases of building knowledge I wanted practical

reusable tools to be inside the kit. The kit consists

most of the original die line contents with a tape

measurer, 6” ruler, safety goggles, eraser, pencil,

and instructional booklet.

Packaging and Die Lines

Beginner Builder Kit | Process

Page 27: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

5352

(Above) Beginner Builder Kit InteriorBecause this kit was geared toward younger audiences I created some characters personifying the two different aspects of the toolkit. Bianca the Builder who is the main guide throughout the booklet and Dave the Drafter that guides through sketches and planning of a project. (Above) Beginner Builder Kit

Beginner Builder Kit | Final Design

Page 28: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

5554

Branding, Identity, UI, UX Design

In this mobile prototyping project I was tasked

with creating a mobile app specific to a disability. I

challenged myself to learn about a new disability.

ProPin is a mobile app for people suffering

from chronic facial pain, Trigeminal Neuralgia.

This hypothetical app utilizes facial recognition

technology to pin point facial pain and provide

resources specific to needs and location ranging

from community based resources to local clinics.

ProPin

ProPin User Log In Screen Mockup

Project 6 | ProPin

Page 29: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

5756

ProPin

Research and DevelopmentThis project required a heavy amount of research

on the disability of Trigeminal Neuralgia itself as

well as looking at what particular functions of a

mobile app could be better utilized for the user

interface and user experience.

A large portion of my process was anticipating

what the user needs and how they would better

utilize the app. This first image to the right shows

this first exploration of possible functions and

user flow of the app. The following images

demonstrate research through a user journey,

content mapping, and UI exploration.

Page 30: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

5958

Provide InformationFacial Scan Pinpoint Facial Pain Filter Results Get Details

Optional Save throughmaking account

Intermediate Steps

User Thoughts/Feelings

• Start up the app and turnon camera for permission

• This allows for initial facial scan(important for personalized results)

• Retake feature available

a little insecurenervous

• Facial scan/photo and allows

• User will be able to choosefrom the three main sectionsof facial nerves to then go intodetail for specialized resources

for user to pin point where the facial pain is

• Based on specific facialregions resources willbe provided (ie. EMTspecialists, medicines,treatments, exercises,clinic locations)

• The information providedcan then be filtereddepending on users needs, location, and availability

• After the filteredresults are acquired it is displayed based onthe different result types

•• Community Resources

••

•• Local Treatment Options

•• Treatment Information

Medical Records/Symptoms Database

• After receiving theresources the user hasthe option to makean account for futurereference

• When creating anaccount the user cansave and track their facialpain so that the resourcesprovided better reflectstheir needs

• That way when there is aflare up they can identifythese irregularities andget additional help

unsure ofprivacy

willing toparticipatefor accuracy

nervous of appkeeping image data

anxiety from informationwary of use

of selfienervouson creatingan accountfeels app

is accurate

personalizedresults

feels confidentwith resultsbased off scan

relief/clarity on available treatmentand resources

confidence in appfor personalized experience

confident on the detailedresources available

confident on the detailedresources available

happy on abilityto save resources

happy with availabilityto save resourceswithout account

happy about retake featurefor more accurateresults

Provide InformationFacial Scan Pinpoint Facial Pain Filter Results Get Details

Optional Save throughmaking account

Intermediate Steps

User Thoughts/Feelings

• Start up the app and turnon camera for permission

• This allows for initial facial scan(important for personalized results)

• Retake feature available

a little insecurenervous

• Facial scan/photo and allows

• User will be able to choosefrom the three main sectionsof facial nerves to then go intodetail for specialized resources

for user to pin point where the facial pain is

• Based on specific facialregions resources willbe provided (ie. EMTspecialists, medicines,treatments, exercises,clinic locations)

• The information providedcan then be filtereddepending on users needs, location, and availability

• After the filteredresults are acquired it is displayed based onthe different result types

•• Community Resources

••

•• Local Treatment Options

•• Treatment Information

Medical Records/Symptoms Database

• After receiving theresources the user hasthe option to makean account for futurereference

• When creating anaccount the user cansave and track their facialpain so that the resourcesprovided better reflectstheir needs

• That way when there is aflare up they can identifythese irregularities andget additional help

unsure ofprivacy

willing toparticipatefor accuracy

nervous of appkeeping image data

anxiety from informationwary of use

of selfienervouson creatingan accountfeels app

is accurate

personalizedresults

feels confidentwith resultsbased off scan

relief/clarity on available treatmentand resources

confidence in appfor personalized experience

confident on the detailedresources available

confident on the detailedresources available

happy on abilityto save resources

happy with availabilityto save resourceswithout account

happy about retake featurefor more accurateresults

ProPin | Research

Page 31: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

6160

Takes Photo/Scan Pinpoint Pain ProcessingAdditional Symptoms

Camera Permission

Yes/No

Welcome Screen User Login

Make an AccountConfirm Filter Settings Filter ResultsFacial Scan

Retake Scan?

Show ApplicableResults

Community Results

Facebook Groups

Support Groups

Self Help Books

Scientific Studies

Scientific Journals

Detailed Symptoms Detailed SymptomsDetailed Symptoms

Medical Records/Symptom Database

Treatment Research

Home Remedies

Treatment Options

Treatment Case Studies

Exercises

Local Doctors

Local Treatment Options

Local Clinics

ENT Specialists

View Timeline

OpthalmicBranch

MaxillaryBranch

MandibularBranch

Edit Pain Area

Save Resources

Share Resources

Email Resources Social Links

Print

Email Resources Social Links Print

View Saved Resources

View Profile

Yes/NoUse Scan?Yes/No

Yes/No

Confirm

Go back to Edit Go back to Edit Go back to Edit

Go back to Edit Go back to Edit

Go back to Edit

View Saved Resources

EyeUpper JawLower Jaw

Takes Photo/Scan Pinpoint Pain ProcessingAdditional Symptoms

Camera Permission

Yes/No

Welcome Screen User Login

Make an AccountConfirm Filter Settings Filter ResultsFacial Scan

Retake Scan?

Show ApplicableResults

Community Results

Facebook Groups

Support Groups

Self Help Books

Scientific Studies

Scientific Journals

Detailed Symptoms Detailed SymptomsDetailed Symptoms

Medical Records/Symptom Database

Treatment Research

Home Remedies

Treatment Options

Treatment Case Studies

Exercises

Local Doctors

Local Treatment Options

Local Clinics

ENT Specialists

View Timeline

OpthalmicBranch

MaxillaryBranch

MandibularBranch

Edit Pain Area

Save Resources

Share Resources

Email Resources Social Links

Print

Email Resources Social Links Print

View Saved Resources

View Profile

Yes/NoUse Scan?Yes/No

Yes/No

Confirm

Go back to Edit Go back to Edit Go back to Edit

Go back to Edit Go back to Edit

Go back to Edit

View Saved Resources

EyeUpper JawLower Jaw

Content Mapping

ProPin | Process

Page 32: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

6362

Brand Development

ProPin | UI Development

Page 33: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

65

With the range of specific facial nerves I wanted to have a simple interface that can pin point specific parts of the face I created over a hundred possible screens. With seventy of those screens prototyped with InVision.

https://invis.io/4JWCTJR7RCN#/408335893_1-

Loading_1

(Left) UI Exploration

64

ProPin | UI Development

Page 34: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

6766

UI Design The final UI design utilized Android material design

with a simple color palette that reflects the brand.

This material design utilizes a geometric block

style UI that aids in accessibility and navigation,

which is useful for those with chronic pain to

navigate the app without need of complex

gestures. I minimized the amount of buttons to

allow for ease of use.

The user flow is simple and straight forward with

the user inputing their information and receiving

refined resources. The most complex approach

to the design was the UI for the facial recognition

software or facial scan feature of the app. I wanted

to create a way for people to pinpoint exactly

where they feel pain in order to receive proper aid

or treatment for that area or see if there are other

nerves that are contributing to that pain.

Final UI (From Left to Right) Facial Pin Point, Profile Screen, Loading Search

InVision Prototype

https://invis.io/4JWCTJR7RCN#/408335893_1-Loading_1

ProPin | Final Design

Page 35: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

6968

Colocha Curl CareBranding, Identity

Colocha Curl Care Products was a self directed

project in which focused on bringing awareness

to the diverse range of curly hair. In this project I

created a hypothetical brand that funds programs

and resources for small businesses to get their

natural hair products on retail shelves. The end

goal being to add more diversity to the shelf.

Colocha final website design.

Project 7 | Colocha Curl Care Products

Page 36: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

7170

Passion ProjectThis project began as a poster series that aimed

to educate the public that there is more than one

type of curly hair. As I began to develop this idea

of educating the public, I then worked on the idea

of a brand that would educate the public through

its packaging, branding, and advocacy. A brand

that not only focuses on providing a product for

their community, but also providing a service to

the community to thrive together,

The packaging would feature a diverse range of

curly hair types on the label itself that by its display

on shelf visually introduces audiences to the

different curly hair types. In addition, th labeling

would have a section describing the hair type

displayed on the label and discuss how best to

care for the hair by utilizing specific ingredients.

(Above) Colocha screen printed shirt and canvas bag.

(Above) Colocha initial sketches and inspiration.

Colocha Curl Care Products | Process

Page 37: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

7372

Process for product labels. Final product packaging with brand messaging of the importance of diversity and inclusion within the retail environment.

Colocha Curl Care Products | Final Design

Page 38: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

7574

For this series of advertisement I wanted to feature different types of curly haired women to show the range of curly hair. Then by placing them with or by the product the audience can see how the product labels visually show this diversity through the illustrated hair silhouettes on the packaging itself. (Above) Colocha advertisements

(Above) Colocha advertisements

Colocha Curl Care Products | Final Design

Page 39: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

7776

To build upon the branding of Colocha, I devel-oped a hypothetical website and online presence on Facebook. Through this I was able to push the branding by determining a digital brand standard through choice to lowercase type and a bright warm color palette. (Left/Bellow) Colocha Curl Care Products hypothetical website design.

(Above) Colocha advertisements

Colocha Curl Care Products | Final Design

Page 40: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

7978

The final brand development was realized through

various explorations and case studies that ended

up into this wholesome identity of diversity and

advocacy. Colocha Curl Care Products brought

together my need to educate the public, while also

laying down the foundation as to how this idea

can materialize through community programs.

The final brand educates the public of the different

hair types through its packaging design and

through its visibility on shelf. The final hypothetical

brand would utilize funds from sales into small

businesses and entrepreneurs working on getting

their natural hair products on retail shelves. By

helping other brands reach the retail shelf, natural

hair becomes more visible and better reflects the

reality of our diverse society.

Hypothetical Branding

Colocha Curl Care Products Mockup Facebook Page.

Colocha Curl Care Products | Final Design

Page 41: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

8180

Colocha ExhibitionBranding, Identity, Packaging, Environmental Design

I continued to push the concept of the Colocha

Curl Care Products project into a BFA Thesis

Exhibition. I used the end of the previous project

as a basis for the exhibition, however I focused

more on issues within the retail hair industry, such

as visibility, attainability, ingredients, and social

acceptance.

Colocha Exhibition Mockup. 17x20” posters with branded packaging displayed in front.

Project 8 | Colocha Exhibition

Page 42: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

8382

Concept DevelopmentColocha is a narrative critique on the current

climate of natural hair products in the beauty

industry and provides insight on the lack of

diversity. Colocha features a series of posters with

narrative typography addressing specific issues of

false advertisement of ingredients, and using curly

hair as a way to falsely promote diversity without

research. Colocha also introduces a hypothetical

brand of curly hair products satirically critiquing

current representation of natural hair in retail

environment and creates an ideal product for its

intended natural hair audience. The exhibition

serves as an educational experience for those

who are unaware of this issue and to promote the

importance of diversity and visibility.

Colocha Exhibition Mockup. 17x20” posters, Version 2

Colocha Exhibition | Process

Page 43: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

8584

Designing for a 3D SpaceGiven the opportunity to transform my messaging

into an interactive experience allowed me to

practice various problem solving skills. Initially

I was thinking of creating something more of

“pop up shop” or small mock booth satirically

discussing the damaging impacts of ill-informed

hair companies promoting unrealistic hair

expectations.

As I explored the retail space further, I was then

thinking of recreating a retail space still holding

the messaging as mentioned earlier, but in a more

subdued manner.

The final mock ups and renderings now reflect a

more educational environment that displays the

posters and packaging in a way that promotes the

messaging of inclusion within the hair industry and

reviews over specific case studies that the public

could learn from.

(Right) Initial sketches for Colocha Exhibition.

Colocha Exhibition | Process

Colocha Exhibition Mindmap and Initial Brainstorm.

Page 44: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

8786

Colocha Exhibition Mockup Render 2.Colocha Exhibition Mockup Render 1.

Colocha Exhibition | Process

Page 45: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

8988

(Above From Left to Right) Colocha Poster 1, Label 1, Bottle 1

I wanted to illustrate the messaging of each poster through the expansion from poster message, to label that details the issue, that then becomes a take away for people to take with them and think about

Messagingbell hooks discusses in The Oppositional Gaze

how the black female spectator perceives

themselves through their representation on film.¹

Colocha focuses on the idea hooks introduces

of not seeing yourself until you see how others

perceive you. The retail environment holds a

strong reflection of society through its very nature

of providing basic needs. With the large mix of

individuals in the country it is quite shocking that

within the hair retail environment, there is limited

representation for people of color. This lack of

visibility quickly becomes an issue in terms of

how we understand the world around us. Without

seeing the full perspective, society can develop

a warped idea of what is normal or acceptable.

Maurice Merleau-Ponty discusses this importance

of seeing the world from all sides in order to

have a better understanding of how you fit within

it throughout his essay Phenomenology and

Perception². I am interested in showcasing this

alternative perspective to advocate for a deeper

understanding of what inclusion means. Many

people say that they want diversity, yet they do not

realize how their ideas of inclusion and or practice

of diversity is actually internalized by those they

are trying to include.

I aim to educate the public on this alternative

perspective of hair culture, to identify the

underlying problem with current diversity trends

and to advocate for a deeper understanding

of inclusion. Through the narrative posters

of Colocha, I invite the audience to question

the realities of diversity and challenge their

assumptions of social norms. With the branded

products presented, I welcome possible

educational solutions through advocating for

deeper understanding of inclusion.

¹ hooks, bell. “The Oppositional Gaze: Black

Female Spectators,” in Black Looks: Race and

Representation. South End Press: Boston, 1992,

pp. 115-131.

² Merleau-Ponty, Maurice. Phenomenology and

Perception. Trans. Colin Smith. 2nd ed. New York:

Routledge, 2005.

Colocha Exhibition | Final Design

Page 46: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

Project

9190

Page 47: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

Project

9392

Online ExhibitionDue to unforseen circumstances the exhibition

was not able to be displayed in a physical space.

The exhibition has since been moved into an

online format to where I volunteered to be apart

of the online exhibition committee. The Thesis

Exhibition course brought together two art classes

and one design class to create the show, with it

now being an online format I alongside two to

three classmates were in charge of setting the

framework on Square Space to allow for students

to upload their work, provide technical assistance,

and training to the classes all within a three to four

week turnaround.

In the committee I worked with the team to create

the back-end support for developing the site and

generating templates for the students to use. I also

led team meetings to teach students and faculty

how to maneuver the site as well as provide

any technical support or design suggestions

for their particular pages. Adjusting all student’s

physical exhibition to a digital format did take a

lot of collaborating from all students and faculty

involved. It took constant learning on the job,

communication, planning, and patience to be able

to coordinate this project with three classes.

https://www.msudenverbfathesis.com/

Page 48: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

9594

All contents are original concepts and designs copyright of Karen Ventura Gasca with credit given to colleagues and associates that have given consent for their contributions to certain projects to be shown.

©KarenVenturaGasca 2020

This body of work has been set in Jos Buivenga’s

Museo Sans font family of the Exljbris Font

Foundry and Eric Gill’s Gill Sans Semi Bold

of Monotype. This book is perfect bound,

with printing done by blurb.com on premium

matte100# paper.

Page 49: PowerUp Date IQ CitizenWolf KONG Beginner Builder Kit ...kvg.design/download/portfolio/KVentura_Portfolio-sm_compressed.pdf · 4 5 PowerUp Responsive Web Design In this project was

96

thank you.