Heidi Makoutz Portfolio Site

Branding is the first step. Begin with pencil and paper so that elements are your own and can be easily manipulated.

Next think of who you are going to market to. Who is the target audience and what are they going to want?

In my creative process, when I find or have an inspirational idea, I draw or write it down as soon as I can.

When the research is at a comfortable place, begin constructing mockups of site design.

The mockup for my about page.

I created a mockup in Illustrator to arrage the grid layout for mockup one.

I created a mockup in Illustrator to arrage the grid layout for mockup two.

After deciding on a design and getting others feedback, construct a wireframe and flowchart which will make building the site smoother and more efficient.

In this case, I had two designs that I thought would work, so after some feedback from peers I made a decision to go with the first design.

Portfolio Process

Full site design, starting with hand drawn sketches and moving to design and coding.

Technology

Illustrator
Photoshop
XHTML
CSS
PHP
Basic Javascript (MooTools)

SMARTLawn Synthetic Lawn WebSite Design

SMART Lawn

Full site design which included coding and copy. Taylored to fit client's needs.

Technology

Illustrator
Photoshop
XHTML
CSS
PHP
Basic Javascript (MooTools)

Heidi Makoutz's Photography Portfolio WebSite Design

Photography

Full site design and layout which included photos, copy and navigation for photography portfolio.

Technology

XHTML
CSS
Photoshop
PHP

Fabio Game

Team project. Was responsible for backdrop designs, assisted in coding for gravity effect and added sound effects in Flash.

Technology

Illustrator
ActionScript 3.0
Flash

Goonies

Designed typography and layout for kinetic type. Used timeline and movieclips for animation.

Technology

Illustrator
Flash
ActionScript 3.0

“I am looking to use my designs in a creative & inspiring way to assist others.”

Learn More...

Contact Me:

Heidi Makoutz

heidi@heidimakoutz.com

Services:

Web Layout and Design
Front End Development
Identity Packages
Invitations
Advertising
Fliers

Recommended:

Making the Most of Whitespace

Web Design Tuts is a site full of great resources for building websites: including tips and tricks, as well as icons and examples.

Color Contrast for Color Perception Deficits

This app is a great resource for determining if your chosen web colors have an appropriate contrast that is user-friendly for all viewers.

Typography for the Web

This site is a great tool when deciding on web safe fonts. It allows you to preview different font choices at different styles and provides you with the CSS for it.

Follow Me:

PDF DOC View

Heidi Makoutz

heidi@heidimakoutz.com

*Indicates Required Field

© 2010 Heidi Makoutz