Portfolio Site Proposal Spring Moon
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
Concept Statement Users that may visit my site: Art/Creative Directors Hiring Personnel Students Friends Co-Workers Advertising Agencies Instructors Clients Design Firms/Potential Employers
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
What story are you telling? Do more than just make things. Be compelling, interesting, and fresh. Drive to the edge, and jump off. Don’t be afraid to think outside the box, and just do it!
List the assets you need to persuade the user: 1-2 Package Design 2 Logo/Identity Sets 1 Ad Campaign 2 Interface/Web Design 2 Applied Illustrations
What will users want to see in order to enjoy What categories will you depict in your mockup? their visit to your site? Portfolio (My best work) Information about me (Resume/Contact)
Intended Audience Potential Employers/Clients
Describe what you need to inform and persuade them of: Promote my: Portfolio and Design Skills Goals of the site: Display my portfolio & attract paying clients My ultimate message/philosophy: “The ability to simplify means to eliminate the unnecessary so that the necessary may speak.” - Hans Hoffman”
Print Design Interactive Media Package Design Identity Design
Concept Statement When designing my portfolio website, my intent will be to deliver a presentation that will best represent my work. I do not want the user to be distracted by the web design and layout, as the whole reason they visited my page was to see my portfolio. My goal is to have the user immediately immersed in my work. Featured work will be displayed on the homepage in categories, in which you could dive deeper if desired. To summarize, I would like the web design (elements, variations, colors) to be very minimal, so my work will show as the highlight of their visit. The navigation will be extremely evident, so interaction with the web will be a real ease. In terms of color, my palette will be very soft, some neutrals with a pop of color only on hover of certain elements. This will help make the user more aware of their interaction with different features and clickable areas.
MOODBOARD
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
Inspiration
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
Sketches
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
- Gridded/tiled look tells more of a story - Either design could easily be coded to be responsive - B/W photos, color on hover (to keep from clashing) - Can easily keep adding projects - Tiling can appear too busy with too many projects (lack of hierarchy)
Style Guide
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Clean, Cool, crisp design.
COLORS
R 69 g 166 B 180 #45a6b4 TYPOGRAPHY
R 136 g 163 B 167 #88a3a7
R 95 g 143 B 147 #5f8f93
R 147 g 146 B 145 #939291
R 105 g 103 B 105 #696769
Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
CREATIVE CONSIDERATIONS
TEXTURES
Site Map
Sketches
R 70 g 71 B 70 #464746
Site Map HOMEPAGE
Concept Statement Style Guide
Inspiration
Wireframes 1 2 3 4
THE WORK
MOTION
THE GRAPHIC DESIGNER
IDENTITY
THE INFO
INTERACTIVE
ILLUSTRATION
PACKAGE
BOOK & PAGE LAYOUT
RESUME
CONTACT
Moodboard Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
WIREFRAMES
Concept Statement Style Guide
Inspiration
Wireframes 1 2 3 4
Logo 340 X 145 PX
Project 1 under from Section 1 500 X 337 PX
Project 2 under from Section 1 500 X 337 PX
Project 3 under from Section 1 500 X 337 PX
Project 4 under from Section 1 500 X 337 PX
Moodboard Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
WIREFRAMES
Concept Statement Style Guide
Inspiration
Wireframes 1 2 3 4
Logo 340 X 145 PX
Cover Image 295 X 185 PX
Cover Image 295 X 185 PX
Cover Image 295 X 185 PX
Cover Image 295 X 185 PX
Cover Image 295 X 185 PX
Cover Image 295 X 185 PX
Moodboard Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
WIREFRAMES
Concept Statement Style Guide
Inspiration
Wireframes 1 2 3 4
Logo 340 X 145 PX
Full Image 704 X 500 PX
Moodboard Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
WIREFRAMES Logo 340 X 145 PX
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI LANDING PAGE
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI HOVER OVER FEATURED #2
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI HOVER OVER FEATURED #3
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI THE WORK PROJECT PAGE
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI THE WORK HOVER OVER IDENTITY
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI IDENTITY SHOWCASE IMAGE 1
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI IDENTITY SHOWCASE IMAGE 2
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI IDENTITY SHOWCASE IMAGE 3
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI THE GRAPHIC DESIGNER - RESUME
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI THE GRAPHIC DESIGNER - RESUME
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
HOMEPAGE HI-FI THE INFO - CONTACT
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
Sources
Concept Statement Style Guide
Moodboard
Inspiration
Wireframes 1 2 3 4
Site Map
Sketches Sources
Hi-Fi 1 2 3 4 5 6 7 8 9 10 11
“50 Fantastic Examples of Beverage Packaging Design.” 50 Fantastic Examples of Beverage Packaging Design Comments. Inspiration Feed, 8 Apr. 2011. Web. 20 Jan. 2013. Casey, Chris. “Web Design Icon Version.2.” Dribbble. N.p., 3 May 2012. Web. 20 Jan. 2013. Julien Pons : A Graphic Designer Working in Paris & London.” Julien Pons : A Graphic Designer Working in Paris & London. N.p., n.d. Web. 04 Feb. 2013. LP Creative’s Portfolio.” LP Creative’s Portfolio. N.p., n.d. Web. 04 Feb. 2013. “Ploc Media Ltd.” Ploc Media. N.p., n.d. Web. 04 Feb. 2013. Shim, Thomas. “ The Manifesto.” Motion Graphics Inspiration | #262 | From up North.” From up North. N.p., n.d. Web. 19 Jan. 2013. SimonOneLove. “14 Social Badges by ~SimekOneLove on DeviantART.” 14 Social Badges by SimekOneLove on DeviantART. N.p., n.d. Web. 05 Feb. 2013.