THE ARTIST I am ar den cy an d r e f i n e m e n t , i n e v e r y s e n s e of t h es e w o r ds . My lif e i s f u l l of p r a n k i n g b r ot h e r s , lo ud I t alian f amilies , a n d d a r e I s a y a wa n d e r l u s t t o t r av el. W h en I t r y an d e n c a p s u l a t e i t i n m y f i n e a r t , it bleeds f r o m t h e w a t e r c ol or s . I f t h e s e t wo wor d s ar e s o il t h en t h e r o o t s of a l l m y wor k a r e d e e p i n t h e pen cil I h o ld in m y h a n d . Th a t ’s wh e r e i t a l wa y s s t ar t s . Fin e ar t an d g r a p h i c d e s i g n - t o m a r r y t h e t w o is a ch allen ge, a n d I l i v e f or c h a l l e n g e s .
1
WHIMSARIA Whimsaria is a children’s stealth learning app. While playing through fantasy settings, the games are designed to develop the child’s spatial learning skills. The app would also allow children to experience new hobbies and adventures through a buddy system with their imaginary friend, a figim. The more the child plays by unlocking levels, the more stars their figim and them gain. The more stars gained, the more perks are rewarded. Being that there was a lack of edutainment games that were able to combine fantasy and educational material, it was through research on the user, who was highly involved in fantasy movies, that a direction of fantasy with some darker undertones was implemented to appeal to a wider child audience.
THE STORY Your imaginary friend needs your help! There is a terrible bad in the land of Whimsaria by the name of Sorcerer Caligo. Caligo and his Blob Henchmen are taking all of the children’s’ stars and making them into nightmares. So strap on your cloud boots because you and your figim need to defeat Sorcerer Caligo and his awful Blob Henchmen to get those stars back for Queen Clara!
MUMP
QUEEN CLARA
Mump is Queen Clara’s ver y own figim. He
Queen Clara rules over all of Whimsaria
will help the user and their figim through
and resides in the Kingdom of Lumen. She
stor y mode.
helps children’s dreams become reality by catching their stars.
SORCERER CALIGO
BLOB HENCHMAN
No one knows why Sorcerer Caligo is so
They ooze and they wheeze and are just
grumpy, maybe Queen Clara forgot to make
as likable as the gum stuck on the bottom
his stars into dreams. Whatever the case,
of a shoe. They help Sorcerer Caligo in
Caligo is on a mission to turn ever y child’s
capturing the children’s stars .
star into a nightmare.
KINGDOM OF LUMEN
KINGDOM OF GLOOM
This floating castle is where most figims
Tucked behind a dark forest, the Kingdom
live, as well as Queen Clara.
of Gloom is where Sorcerer Caligo and his blob men reside.
APP ICON
HOME
STORYMODE
S TA R B A N K
STORY MODE Children are encouraged to go through the stor y mode of the game which introduces them to all the characters in Whimsaria. After they finish a level, the child can always revisit their favorite games in the levels option once on home screen..
EXPLORE Users can explore all of the territories of Whimsaria which include: Kingdom of Lumen, Kingdom of Gloom, Ashdale, Mysteria Island, and the Never Plains.
S P E E D Y S TA R S Speedy Stars is one of the many spatial learning games in the app. The premise is to turn each pipe so that the correct colored star gets into its corresponding bottle. The game teaches children hand eye coordination, memor y, and attention.
C R E AT E A F I G I M An integral part to the app, the user is able to create their ver y own figim. The word “figim� is derived from a blend of the words figment and imagination.
2
BAIT AND SWITCHED Bait and Switched is a public awareness campaign for seafood fraud. The campaign was made in mind for those in the fish market who want to know where their money is going to, or how their business is being affected. Examples would be: fish farmers, supermarkets, and restaurants selling fish. Those with health risks or allergies associated with certain types of fish should also be made publicly aware. Being a public awareness campaign, the ads needed to be dramatic. By creating a dynamic visual through Adobe Photoshop, the intimidating or other wise monstrous fish on dinner plates became the focus for the campaign. The photographs were integrated in other aspects in the campaign and the color palette pulled from the three different ads was used in the rest of the campaign such as the infographic. By establishing the campaign through three different platforms-
social
media,
traditional
media,
and
interactive- the hope was to gain as much awareness of the problem as possible.
S I LV ER A D D Y
2017 American Advertising Awards
Bait and switched?
Seafood fraud occurs regularly, cheating you in restaurants and stores, and putting your health and the oceans at risk. Help stop seafood fraud and learn more at oceana.org
MAGAZINE AD 9x12
Bait and switched?
Seafood fraud occurs regularly, cheating you in restaurants and stores, and putting your health and the oceans at risk. Help stop seafood fraud and learn more at oceana.org
BUS STOP POSTER 30x36�
A N I M AT E D A D Fat skyscraper banner
Menu enters scene at restaurant
Customer points to the salmon on the menu
The menu is taken away
The waiter ser ves the customer a plate of fish that obviously doesn’t look like salmon
The words “bait and switched?” ripple into view.
The words “Learn more at oceana.org” fades onto the screen.
...
#FightFishFraud then appears. If the viewer clicks on the ad it will take them to the campaign site.
3
NAVIMATE Navimate is a fictional app made to wayfind and curate for people with specific shopping interests. The functionality of the the app is based on the user’s likes through Facebook. The idea is that Navimate will cater a series of shops based in the user’s location as well as use the user’s selected interests. Navimate would be geared towards people ages 20-30 looking for an efficient way to broaden their shopping experience. The app needed to be clean and modern to fit in with the desired age bracket and the tone would be fun and inviting to portray the true meaning behind Navimate’s name- a companion to help the user find stores.
L O G I N PA G E By linking Navimate to Facebook, it would better allow Navimate to do its job by curating the user’s shops based off their likes. The main login page was designed to give the user a small taste of what the rest of the app will look like.
PROFILE Through their profile, the user will be able to curate and collect their favorite stores where they will shop.
MAP By clicking on any particular shop, the user will be pulled to the shops profile. On this particular page, the user will be able to look through photos of the shop, go to the shops Yelp page, and select the map icon to get directions within the app.
SEARCH BY TOPIC This allows the user to search more efficiently by selecting the most common categories among shopping.
STICKER Users
will
be
able
to
tell
which
stores
are
recommended by Navimate by locating this sticker. It acts as an advertisement for Navimate, as well as giving the business credibility.
4
KEEPIN’ IT COOL This was an ad campaign to bring awareness and boost sales at The Hyppo: Gourmet Ice Pops, an existing brand in St. Augustine, Florida. The target audience focused on those who value what goes into their body, someone part of the health craze, people interested in different and unique tastes living in Florida- mostly areas on the coast with hot climates. Hyppo already has focused on the college age and up in Florida, so the goal was to include a younger audience. The design approach was to go along with the already existing brand of the Hyppo which is fun, brightly colored, and illustrative. By creating a narrative to hook the younger audience, the final solution was a campaign which focused on Miss Mango, Cool Cucumber, and Fresh Strawberr y. The headers and language were kept fun and inviting following the main slogan of the campaign: Keepin’ it Fresh to appeal to the younger audience. Since Hyppo ice pops focus on three main components that set their pops apart from others, the campaign focused on the message in a fun and modern way thus the headers “Keepin’ it Fresh”, “Keepin’ it Cool”, and “Keepin’ it Real” was used. Fresh for fresh fruit, Cool for popsicle, and Real for real fruit.
MAGAZINE AD 9”x12”
POSTER 20” x 30”
FREEZER DECAL
5
VOXBI voxbi
is a business that supplies developers with the
coding necessar y for creating a chatbot through ReniBot and other businesses with the ser vices needed to execute a functioning chatbot. Renibot is a cloud ser vice for developing and hosting chatbots that communicate via SMS. Renibot provides an integrated development, environment design, a space where developers can create and test their chatbots. With ReniBot the user will not need to provide any infrastructure as it is all hosted in the cloud. A chatbot is an artificially intelligent software program that mimics conversation with a person. When a chatbot is properly implemented a user will not be able to tell if they are messaging with a live person or a computer application. The
design
goal
was
to
make
Voxbi
visually
darker and give it a modern edge compared to its competitors. The next step was in prototyping and creating wireframes for the prevention of any site functionality loss and take in the amount of all the content on the site.
COLORS & ICONS
WIREFRAME
M A I N H O M E PA G E
D E V E L O P E R ’ S H O M E PA G E
6
DELVE d e lv e
is an app for marine biologists looking for a
simple and reliable place to store and publish their research. The goal was to create a highly user-friendly interface design that would allow these scientists ease of access anyway they might be conducting their research. The
colors
used
professionalism,
were but
to
convey
were
also
a
sense
selected
of in
consideration of scientists who would be outside which would strain the eyes. Through a series of UX and UI design prototyping, I arrived at an app that not only helped the user input their data, but export data as well as network with other scientists and their research.
O B S E R VAT I O N By obser ving fellow peers in science classes. After inter viewing them in the manner of efficient data collecting, their biggest common complaint was that it was hard to organize their data and keep it concise. By focusing on one user and it was established that it was hard for the user moving data around through different programs. It was also discovered that they needed a well-organized space to keep all of their data for their marine science classes. They also needed something to help them with fish identification among other scientific needs in the field of marine biology research.
I D E AT I O N As a result of customer-development research, a list of user needs was comprised based on this example: site identification is not as accurate as DNA barcoding for marine biologists. It is also hard to keep data organized and record it in an efficient manner. The conclusion was that it was easier to have artificial intelligence identify the marine species while also recording that data in the same location. While developing the app closely to the one selected user, it was easy to gather more needs that marine scientists have while conducting their research.
W I R E F R A M E & PA P E R P R O T O T Y P I N G T E S T I N G Through human-centered research, the purpose was a lot clearer for the app. The user was able to go through and express what would be easier in usability, what should be added, what could be taken away. This, above all, was the most important aspect. Without that process, the app would have not become as usable and credible. Revisiting the goal to make sure the design ser ved the user’s’ needs, the decision about which prototype to develop further was made. The paper prototype was easier to share with the user and iterate different designs based off the user’s feedback. Next, a digital wireframe of the main screens to get the direction was made, and later on the high fidelity prototype on Proto.io. In this case, the high fidelity prototype was produced to define the interaction and was used for test purposes.
WIREFRAMING
ICON
FIND RESEARCHERS
By looking at other scientific apps and fishing
Other researchers are easily accessible
apps, the goal was to make it stand out from
for the user. This will benefit users by
other similar apps. The result was combining
allowing them to network and get their
the more sophisticated colors with the stylized
work noticed. Users are also able to
D in the shape of a fish.
publish their work through the app.
A I F I S H I D E N T I F I C AT I O N
AUTO INPUT
Through artificial intelligence, the app is
The app is able to input data based off
able to learn different fish characteristics
the location GPS on the user’s phone.
as more users input their data. The more data that is harbored in the app, the more accurate it will become in identifying the fish for the users.
B E S T M AT C H
E X I S T I N G D ATA
Through Ai, the app is able to provide
Users will be able to look at other data
a list of species based off of the picture
collected by scientists in the area and have
the user provided of their data. It works by looking at the ratio between certain anatomical parts of the fish.
the option to add it to their own findings.
E X P O R T D ATA
ENCYCLOPEDIA
Users will be able to export their data
Users have full access to an encyclopedia
efficiently into their phones for easy
to look up their data and see if it
access. They also have a variety of options on how they would like to export their data (e.i. graph, table, etc.)
correlates correctly. The users will also have an option to input their own findings once they are published.
D E LV E R D E E P E R Delve Deeper is an academic journal to go along with the app. Each month Delve Deeper takes the most captivating research from the app and compiles it into a softcover journal.
7
HEAD SALON HEAD Salon Emporium is a new concept hair salon. It combines the hair artistr y of Monica Zonni, the lead and only hair stylist, and the galler y setting in which she performs her work. Each month the galler y changes and she hosts another local artist. This project aimed to rebrand the salon so that it had more cohesive look and was viable against other salons in the area. The tone of the company was fun, natural, organic, and artistic with eclectic tastes. The goal was to incorporate all of these things into the branding.
EXISTING LOGO
NEW LOGO
The existing logo for HEAD was a combination
The logo was a nod to the old logo with the
of too many elements and needed to be reigned
resemblance of the head, but adding the natural
back into one visual message.
leaves to denote the organic nature of Monica’s salon. The pairing of the serif and sans serif was to make the brand look modern and appealing. The influence of the abstract marbled paper was used to incorporate the art and the Boho feel of Monica’s salon as well as a touch of natural and earthy tones.
EXISTING SIGNAGE
NEW SIGNAGE
8
THE BEASTLYS The Beastlys is an app for children ages 7-13+. Set up as a stealth learning app, The Beastlys teach children basic to more advanced language arts skills through reading along with the monsters, all-the-while picking up important social lessons such as: How to make friends, personal hygiene, manners, and overcoming bullies. The tone of the app is inspired by Tim Burton and the styles of the Disney animation 101 Dalmatians which is more prominent in the motion graphics. This style was taken into consideration as a way to set the characters apart from other modern children’s characters. As Miss Fae always tells her monsters “When given an opportunity to be normal, be unique.�
GOLD ADDY
2016 American Advertising Awards
BRAMBELLE
M I S S FA E “Hello little one! My name is Fae Beastly
but
you
may
call
Miss
Fae. Welcome to my foster home
“Who
are
you?
Whatever..er
I
mean nice to meet you. This is my room. Do you want to play tag?”
for monsters. Enjoy my little ones’ stories and have fun exploring our small village of Pete.”
EDGAR
HUGO “Bwarf!
Do
you
want
to
play
outside? I saw a nice mud puddle out by the garden!”
“Hello, my name is Edgar. Welcome to my room. Do you want to see my science experiment?”
VICTOR “Grrrg...Victor’s room… Victor likes to read and make friends.”
VIOLET “Hi there! My name is Violet, welcome to my room! Do you want to look at my rock collection? Or maybe we can play with my solar system model”
MILLIE
DUNE
“Hello friend! It’s ver y nice to see
“H--Hi! Do you want to go down to
you. Do you want to play in the
the beach with me? We can build
tea garden?”
sand castles and fly a kite!”
WIREFRAME
miss fae ’ s study
home
the children ’ s rooms
The House
victor room
"victor
makes a friend "
violet room
"violet
meets her monster "
millie room
"millie learns her manners" "hugo takes a bath"
hugo room learning manners in the gable
map
edgar room
Garden explore the village of pete
Village
of
brambelle room dune room
Pete "dune
and the big storm "
Collect
Pete Beach
story
shells with
Dune
victor bio videos
violet bio millie bio hugo bio edgar bio brambelle bio dune bio miss fae bio
characters
USER BLUEPRINT The user blueprint shows the user touchpoints with products in the Beastly brand. In theor y all components of the Beastlys correlate with one another, and the user can easily be led to the other product by use of another. This was just one example stor yline that a user might follow with the Beastly brand.
"edgar
the interrupter "
"brambelle makes a wish" "dune and the big storm"
HALLOWEEN
BEASTIES & HEXES
TEA IN THE GABLE
A N I M AT E D S T O R Y S A M P L E S C E N E S From “Victor Makes a Friend”
HOME
MAP
The user will be able to flip “This Way” and “That Way”
The User will be able to explore the small world the
through all the map locations. Each place is selectable
Beastlys live in.
to explore. By tapping on the house the user will be lead inside where they will have the option to go to the bedrooms of their monster friends.
STORY VIDEOS
CHARACTER BIOS
Each character has a stor y and lesson for the user
The user will be able to learn a little more about their
to learn.
favorite monsters by tapping on their file information.
DOORS
VIOLET’S ROOM
The user will be able to enter each monster’s room and
In Violet’s room the user will be able to interact with
interact with them and their possessions.
Violet who will talk about her favorite bug species, the rock display where Violet will educate the user on the different rocks, and the horticulture rose poster which will allow the user to go to Violet’s stor y video.
VICTOR’S ROOM
DUNE’S ROOM
In Victor’s room the user will be able to interact with
In Dune’s room the user will be able to interact with
Victor who will talk about his favorite book authors
Dune who will talk about the different species of fish
from his bookshelf, his potions where the user can mix
in his fish tank, his shell collection which will give the
different potions, and the rose in the vase which will
user the option to go to Pete Beach to play Dune’s shell
give the user the option to go to Victor’s stor y video.
collecting game, and the kites which will give the user the option to go to Dune’s stor y video.
BOOK COVER The printed version of the Beastly series is another way to reach children. It was taken into account that schools would not allow the child to access tablets and providing them with printed versions of each character’s stor y is another way to build the brand and establish the lessons from the app. Dimensions: 8.5” x 5.5”
PLUSH TOYS The plush toy was also created in order to establish the Beastly’s brand at home and connect the printed books and the app. Through research, it was found that creating a physical representation of the characters would form a greater attachment by the user. D i m e n s i o n s : 8 ” W x 11 ” H
All good things come to an
end.