Site Inspiration

Edenspiekermann

Edenspiekermann’s agency website combines some very attractive full browser content at the top with beautiful animations and quality content. Further down, the content is heavily structured and very clean, mostly utilizing white boxes with content over a slight grey background. The “Our Offices” section features staggered rectangles with images of the city’s they work in, with some hover effects (this is definitely something i’d like to consider including in my site. Their red based identity is also extremely appealing to me, as i’ve worked with using just red in the past with good results.

Niko Elenchevski

This is Niko’s portfolio site, created during Web 2 very recently. The entire design is minimalistic, straightforward, and easy to navigate. Outside of the portfolio items, the only color that is visible is the red in his logo. The simplicity of the site allows for minimal drastic change in breaking points, only adding a hamburger at the small and extra small sizes. I may want to include some slightly more intricate content, but this style of design would suit my needs well.

Hoefler & Co (Typography.com)

This site features dozens of typefaces available for purchase on their homepage, but displays tightly packed examples of various fonts in use rather than a list with its name. The header and dropdown options retain a soft white/grey on grey that is comfortable to navigate. Other pages feature gridded content on a white background with ample whitespace. This site is a quality combination of fluid, content intensive pages mixed with structured, highly organized information.

About Google

Google’s about site essentially serves as their company homepage. The simple header narrows down the entire site, which links to other pages with large amounts of content. When scrolling past the header on these pages, a new header appears with links that scroll to that respective section of the page. If I find my site to be long enough, or if I design a single page scroller, i’d like to implement this type of feature.

Kleidon

One of Akron’s local design companies, Kleidon’s site features a lot of information that is organized well. The entire site is fluid, with most content stretching the entire page, yet consistently cut into either halves or thirds at large sizes to retain some fixed structure. Useful for my purposes, the site has content similar to what I need, with a home, portfolio, about, and blog page. Their subsidiary, kleidoscope, includes similar features but in a single page scroller.

Apple

Apple’s identity is clean and straightforward. Their well established identity allows for a symbol to be used in place of a logo with text, which while appealing, is not practical for an unestablished young designer. The mostly achromatic design allows for those areas with color to be a focal point, so I may consider this approach to make my portfolio items “pop.”

FHNW (University of Applied Sciences and Arts Northwest Switzerland)

The site’s homepage may be a bit disorganized for my liking, but the overall content is clean and functional. The left align header is present at the top of a page, but collapses as I scroll to open up white space on the left. A bit more breathing room overall would put this site higher on my list.

Sol Kjøk

Kjøk’s website is extremley minimalistic, and also achromatic like Apple’s site. It features a left align header with margins large enough to make this fact obvious. While I personally don’t wish to use a left side header, the simple menu may be worthwhile to include in a dropdown navbar.

Facebook

While generally used for something completely different than a portfolio, Facebook’s site is inviting and comfortable to navigate, at least in my opinion. Using some of the same principles could make my site equally inviting, leading them to stay a while and keep looking.

W3 Schools

Through Web 1, my instructor only covered some of the basic skills to create sites, and encouraged many of us to find external knowledge to complete certain things. Whether it’s learning to do a dropdown for the first time or reminding myself the number order of padding, w3schools provided the information with ease.

 

Return to Blog