Portfolio

Melisa Frampton

Contact

Table of Contents

Melisa Frampton:

Imaging
Montage
Letterhead
Business Card
Logos
Brochure
Web Page
Event Ad
Flier

490 Pioneer Rd
Rexburg, ID 83440
801-473-4354
melisaframpton@gmail.com

Imaging
Description:

A photo that was taken personally and then edited and

formatted in Photoshop

Date:

5/23/15

Course/Instructor:
Comm 130 Section 17
Brother Jason Stucki

Programs/Tools:
Canon Camera
Adobe Photoshop

Objectives:

Learn basic photography skills

Choose a color scheme, take a picutre to match, and
incorporate the colors into the layout
Use a digital camera to take a photo and upload it
Learn how to use filters in Photoshop
Use layers to design text and repeating graphic
elements in Photoshop

Process:

I first picked out a color scheme and what I wanted and

I went outside to see what kind of colors I would have
to work with with what was around me and where I
was going to be taking the picture. I used the camera
that I had to try and focus on good leading, as well
as having the background blurred and the subject in
focus (the subject being my husband). After taking
the picture, I made some sketches of how I wanted
to display the quote that I had chosen and how the
picture would fit best in conveying my message. I used
Photoshop to edit the picture using the skills mentioned
in the project, as well as what I have already done with
Photoshop. I tried to focus on alignment, focal point,
and visual hierarchy.

Montage
Description:

An inspirational montage made by the blending of two

or more images, and the use of typography

Date:

May 30, 2015

Course/Instructor:
Comm 130 Section 17
Brother Jason Stucki

Programs/Tools:
Adobe Photoshop

Objectives:

Learn to manage Photoshop layers

Learn to blend images together using masks
Use filters
Apply appropriate typography

Process:

I started out by trying to find a quote that I really

liked and wanted to create an image out of. After
finding the quote, I sketched a bunch of ideas on how
to convey the message in a way that I thought would
best add to the meaning of the quote and give more
insight into what it was really saying. I wanted to focus
on focal point and visual hierarchy in completing this
assignment. I ended up with the idea that I choose
above with spiritual knowledge being represented by
the heavens and light. Using Photoshop I started with a
coffee cup and inserted in two different pictures of the
sky/clouds/sun. I blended those pictures together and
had them coming out of the cup a bit. Then I added
some birds just to add more to the meaning. I thought
it would help with the hierarchy if I didnt necessarily
have the quote as the main focus, but that others can
think on the picture before knowing the quote- so I used
Illustrator to form the words and imported that into
Photoshop to put on the plate holding the cup.

Letterhead
Description:

Matching letterhead and business card designed using

a personally created logo

Date:

June 13, 2015

Course/Instructor:
Comm 130 Section 17
Brother Jason Stucki

Programs/Tools:
Adobe Illustrator
Adobe InDesign

Objectives:

Create a new logo to fit a company or personal image

Design consistent layouts for a business card and
letterhead
Use the basic tools of InDesign and Illustrator

Process:

The program that I used is Illustrator in order to

create the logo and the swirly lines, and then I used
InDesign to put everything together on a letterhead
and a business card. I chose the colors, based on
the fact that I liked the look of the purple and then
choose the complementary color to go along with it.
I incorporated that throughout the designs. I used the
pen tool in Illustrator to design the curvy lines, as I
thought that would match and go along with my web
design business, as I wanted it to represent creativity,
flexibility, and blending of things together.
In the letterhead, I wanted to have more symmetry,
and after putting the color and lines on the bottom, the
top looked uneven, so I took a few of the lines, flipped
them around and lowered the opacity to have it come
together and not look unbalanced.

MELISA

{mf}

FRAMPTON

Melisa Frampton
490 Pioneer Rd.
Rexburg, ID 83440
801-473-4354
www.melisaframpton.com
mqframpton@gmail.com

Business Card
Description:

Matching letterhead and business card designed using

a personally created logo

Date:

June 13, 2015

Course/Instructor:
Comm 130 Section 17
Brother Jason Stucki

490 Pioneer Rd.

Rexburg, ID 83440
801-473-4354
www.melisaframpton.com
mqframpton@gmail.com

Melisa Frampton

Programs/Tools:
Adobe Illustrator
Adobe InDesign

Objectives:

Create a new logo to fit a company or personal image

Design consistent layouts for a business card and
letterhead
Use the basic tools of InDesign and Illustrator

Process:

The program that I used is Illustrator in order to create

the logo and the swirly lines, and then I used InDesign
to put everything together on a letterhead and a
business card. I used the pen tool in Illustrator to design
the curvy lines, as I thought that would match and go
along with my web design business, as I wanted it to
represent creativity, flexibility, and blending of things
together.
I took the same design that I created, and just zoomed
in a lot to bring it to a spot that would represent the
same thing, and put that same design on the business
card, so that they would go together, and although not
identical, that they would look like the same company. I
thought it looked a lot better than trying to fit the whole
design on the business card. I then added the text to
both and thought the line under my business name, to
break up the text and add more variety.

MELISA

{mf}

FRAMPTON

Logos
Description:

Three logo variations for the same company

Date:

June 6, 2015

Course/Instructor:
Comm 130 Section 17
Brother Jason Stucki

Programs/Tools:
Adobe Illustrator

Objectives:

Create a variety of logos to fit a company or personal

image
Use the basic tools of Illustrator

Process:

I designed this logo in Illustrator using the pen tool.

and line tool, and by manipulating the text to match the
lines of the computer. I wanted it to be more abstract,
and so I designed the computer that way, where its
abstract, as that matches a lot of what Im about- web
design, and designing things that are outside the box.
I used alignment with the M and F so they are
aligned and that the F completes the side of the M
that is missing. I also used symmetry, but distorted it a
little bit so that its not perfectly symmetric.

Melisa Frampton Design

Brochure
A three-sided folding brochure

Date:

July 11, 2015

Course/Instructor:
Comm 130 Section 17
Brother Jason Stucki

Programs/Tools:
Adobe InDesign
Adobe Illustrator
Adobe Photoshop

Web Design

Digital Design

I can customize your site to make it look

how you envision your website to be

Video and images captured help to once again

feel the joy at any moment in time

My knowledge includes
HTML5, CSS3, and
Wordpress. Knowing
HTML is very important,
to have mastered the basics
to be able to to conquer
the harder things. Knowing
CSS allows me to be able
to style the webpages in the
way that you want.
Wordpress can be used
professionally to create a
business website; Ive made
sure to master the skills
needed to provide you with
the best experience.

Experimenting with my
camera, I have been able
to capture professional
photos and images, which
has pushed my creativity
and helped to learn more
about design.
I have recently started
learning about Illustrator
and InDesign, to create
projects, f lyers, ads,
portfolios, and the like,
in a professional manner.
Videography helps bring
to life the things that we
experience every day.

MELISA

{mf}

FRAMPTON

Web Design

Description:

Objectives:

Create an original new logo to use in the brochure

Incorporate at least 4 quality images
Write at least 250 words of original copy in at least
three paragraphs, headers, and subheaders.

Process:

With this brochure I used three different Adobe

programs: Photoshop, Illustrator, and InDesign. I used
Photoshop to enhance the pictures and help with the
coloring to go more with the colors that I choose. I
also used it to do a cut out of the girl with the text-wrap
around her.

I can get all

aspects of your

The design you want comes to you!

business up and

I will provide your business with the best

chance of success in this digital age

running on the
web to provide you
with the best chance of success

I used Illustrator to create the logo that went along

with the project as we had to create a new logo. I
tried to think of something that would have to do with
web design, so I used the symbols that you would use
when coding css {} and incorporated that into my
logo design. I then used InDesign to create the actual
brochure and put the pictures from photoshop and logo
from Illustrator into the brochure. I wanted to try a trifold and thought it would look interesting with the top
flap being just a bit shorter than the rest, so you could
see the web underneath.

in this digital age.

Im currently pursing my
bachelors degree in web
design at Brigham Young
University Idaho. My
passion started from my
mom who is a web designer
herself and introduced me
to the wonderful world of
web design.
Not only do I love web
design, but my interests
and skills reach beyond
that. Come to me with
your needs and I can get all
aspects of your business up
and running on the web.

Web Page
Description:

A webpage designed to showcase a personally created

logo

Date:

June 27, 2015

Course/Instructor:
Comm 130 Section 17
Brother Jason Stucki

Programs/Tools:
TextWrangler
Adobe Illustrator

Objectives:

Size and optimize an original logo for a webpage

Write content describing the process of creating the
logo
Design a webpage using HTML to display content and
a logo
Have a basic understanding of CSS
Identify hex colors for web design
Compress multiple files into a zipped folder

Process:

I used TextWrangler in order to complete this

assignment. I used the knowledge that I have of HTML
and CSS to create this webpage.
I also used the design principles that we have been
learning with negative space, alignment, typography
to make sure that my page looked right and that it
followed the rules that we have been learning as to
make it the best that it could be with the tools and time
that we had.

Event Ad
Description:

A color full-bleed event ad to promote a fundraiser

using only Microsoft Word and a scanner

Date:

May 16, 2015

Course/Instructor:
Comm 130 Section 17
Brother Jason Stucki

Programs/Tools:

Microsoft Word
Scanner
PDF2JPEG.net (PDF converter)

Objectives:

Find, scan, and import a high quality image

Create a full-bleed design
Use text boxes for layout in Word
Insert and edit images in Word

Process:

For this project, I started out by picking an image that

we had in a magazine. I liked the look of this picture,
and how it was blurry already and had a focus point,
so I thought I could use that to my advantage. I then
thought of what I could have this picture represent and
how it could work for a benefit event, so I thought of
things that could do with flowers.
I brainstormed some ideas, and then I started to
sketch those ideas out and how they would look as an
event ad and would best represent the audience that
I choose. I tried to focus on the focal point that the
image had already created of the flower and picked
the color scheme that went well with the colors that
were already in the picture. I also focused on alignment
and once again using white space to my advantage so
it would have a more clean and crisp look and feel to
the design.

Flier
Description:

Black and White promotional flyer to promote a

graduate leadership conference

Date:

May 9, 2015

Course/Instructor:
Comm 130 Section 17
Brother Jason Stucki

Programs/Tools:
Adobe InDesign
Adobe Photoshop

Objectives:

Apply the design principles and use appropriate

typography
Incorporate basic InDesign skills to improve basic flier
layout
Create a project folder with image, logo, and InDesign
document to keep links intact

Process:

For this project I started by sketching four different

ideas, and then choose the one I thought best
represented my idea and audience.
Taking it to InDesign I sharpened up the image and
made it clear. I focused on focal point, alignment, and
utilizing white space to give it a professional look.
I also tried to use contrast by bringing out the most
important words through bolding them.