WP Portfolio: Planning

Mission Statement: To provide a clean, simple, content-focused portfolio site – big on imagery with side notes (asides), custom footers, and related content. Each Post/Page is to be as self-contained & as well-organized and designed as possible.


Overview

Powerful CMS:

  • Integration of social media tools
  • Visitors want: About and Contact pages, good support for news/blog content
  • Authors want: ease of customization and branding

Key features:

  • Highly customizable colors
  • Space for a bold mission statement on the homepage
  • Plenty of ways to organize content so that it looks more like a printed brochure than a standard text blog

Sharing:

  • Similar to Image-centric theme, but more consistent content size/shape
  • Visitors want: to share videos easily
  • Authors want: easy support for multiple kinds of embeddable video players

Key features:

  • Customized layout and features specific for video (making video viewing as easy as possible)
  • Allow users to easily browse for similar content
  • Social media sharing link prominence

Visual:

  • Photographers, design studios, illustrators, image-rich magazines
  • Visitors want: large, attractive images + easy browsing
  • Authors want: lots of prominence for images in the layout

Key features:

  • Size of the main content column = max width of image
  • Lightbox
  • Image Gallery Template
  • Custom thumbnails
  • Homepage image slider

Classic:

  • Built around frequently updated text content.
  • Visitors want: easy access to the content they seek.
  • Authors want: easy publishing.

Key features:

  • Typography: big, juicy, and readable.
  • Finding content: various methods to find content due to large amounts of writing.

Primary content: Portfolio pieces (images), text describing the images, nice Tag and Category design, case studies, educational pieces as well (blog). Big, juicy typography.

Other types of content: Easy video embeds. Branding customization. Nice grid system.

Key features: 

  • Single-column
  • Big titles
  • Big header/featured images
  • Custom Fields
  • Custom Post Types
  • Asides in text (coupled with sections)
  • Responsive design (up to the current width – <aside> moves below <section>)
  • Homepage widgets and slideshow
  • Homepage Category/Post slider with Latest Posts
  • Various page layouts (including 1/2 column widths)

Audience

New-comers: Want to be impressed and explore. Instant, quick, bold and bright images and good content need to draw them in and keep their attention. Also provide good links to Related Posts.

Returning visitors: Probably want to learn something. Need to have a series of posts on a certain topic (similar to learn.shayhowe.com). Good, simple archived Category design.

Business: Should be easy to find portfolio pieces. Should have a grid that’s easy to see many at once – to choose which ones are appealing. Easy to Contact, get Quotes, etc.


Publishers

Expected knowledge: The publishers ought to be designers or people who want to showcase images. Probably are familiar with blogging basics.

Beyond average: Some Custom Fields can enable custom footers. <aside> can make side notes on various <section< content.


Overall design layout: 

Portfolio-wireframes2

Sitemap:

Portfolio-sitemap

Inspiration:

Themes:

  1. TwentyEleven Theme
  2. Mars Hill Church
  3. SitePoint Redesign
  4. Socially Awkward Blog
  5. Justin Tadlock Redesign

Plugins:

  1. WordPress Post Title Subtitles (1), (2), (3), (4), (Justin Tadlock)
  2. Portfolio (JTadlock)
  3. Whistles (tags, accordions, toggles – JTadlock)
  4. Cookies for Comments
  5. Pro WP Plugin Dev (JTadlock)

Scripts:

  1. None yet…

Additional features:

  1. Custom Fields: Different footers/disclaimers (Michael Hyatt’s site)
  2. Custom Fields: Post subtitles
  3. Custom Fields: In-a-series
  4. Hybrid Core PHP developmental foundation

About Aaron

Hey it's-a me! Aaron-io!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>