Deconstrukt #1: Portfolio Design ~ Top 40 Client Showcase Pages

Deconstrukt #1: Portfolio Design ~ Top 40 Client Showcase Pages

Deconstrukt is a new editorial series that features industry leaders giving a bite-sized deconstruction of the web. Hot sites, new technologies and strategies for success in the field of web design & development.

To kick off this inaugural edition, we share 40 superlative examples of portfolio presentation pages designed with the client in mind.

In this article we'll be focussing mainly on the presentation of client work within a designer's portfolio rather than the portfolio design itself (with a couple of exceptions). Two reasons for this. First, many of you will already have glanced at the main pages of these sites but may not have dug deeper to expose the pages that client's really care about, the ones featuring the client themselves. The second reason is that nothing makes you bring your A game more than a fussy client and/or aggressive competitors, both of which head straight to your portfolio to judge your worth. This added pressure is often the driving force in making these pages some of the best visual experiences on the net.

Here is a collection of 40 superb client project page designs we believe have met their respective A-game requirements and kicked them right through the net. No doubt we've missed some this time around so drop us a line if you think you have a page design to add to the next line up.

The page designs have been tagged for selective viewing if you're looking for some specific inspiration.

  • 1. Locomotive ~ Canada

    Client Page: Triathlon Urbain

    Spacious, amazing color palette and on-trend with laser precision. Locomotive's portfolio page design should win an award on its own. A class act. 'Nuff said.

    #minimalist #fullscreen #trendsetter #immaculate

    Locomotive - client showcase page

    Visit this page >

  • 2. Activation Nodeplus ~ China

    Client Page: BMW BEC App

    Some load time here depending on your net speed but definitely worth the wait for this high impact client portfolio page design. The peeps at Activation Nodeplus probably gave their client BMW an adrenalin rush from the get-go via the sheer visual splendour of the hero photo. This is followed by classy glide-in visuals as you scroll, intelligent and unique layout for the content - and a footer right out of the next Tron movie (if there was one). All finished off with some of AN's signature 'hyper electric polygon animation'.

    #visuallyspectacular #dynamic #animated #subtlemotion #hyperactivefooter

    Visit this page >

  • 3. mystaticself ~ Canada

    John Lacoviello's portfolio has no direct links to the client pages but before the little UX voice inside you gets mad, head over to the site and check it out. This site forces me to write the word 'wicked' to describe it. With a site like this we don't care if the client likes it. Describing this site will not do it justice but for those not feeling clicky yet, here is a condensed summary. There's this floating microchip type thing, like a baby Borg cube, with a molecular phase shift problem hovering in front of a randomly shifting sequence of vibrant color vignettes that is... this is too hard. Go and see it for yourself but go gently with your mouse on the baby Borg cube, it's an interactive navigation. Have fun. Ground breaking stuff!

    #innovative #addictive #advanced #soundscape #animated

    Visit this page >

  • 4. John Karlsson ~ Sweden

    Client Page: Pingdom

    Let's get this out of the way, go to John's home page ( and move your mouse around on his logo. When you're done playing with the interactive logo, head to his portfolio. We think John has done a great job of infusing some technical attributes to this page design which is perfect for a client like Pingdom. Client happy = job well done.

    #sleek #clean #video #brandstory

    Visit this page >

  • 5. TMBR ~ USA

    Client Page: Converse Sonata

    TMBR appeared to have mastered the melding of grace and sophistication to outdoor motifs as this page demonstrates. The basic elements are there, superlative photography, subtle tile loading effects, minimalist text boxes and a mountain boot full of style ~ all done with warmth and charm no client could resist. Marshmellows over the fire anyone?

    #photographic #balance #warm

    Visit this page >

  • 6. Media Monks ~ Netherlands

    Client Page: Google's Android Wear Watch Faces

    To ease us into this exposé of great client portfolio pages we couldn't go past this uber clean portfolio page design by Media Monks for Google's Android Wear Watch Faces. We love this spacious yet 'cut to the chase' design that features the core elements aka what the client wants to see. Easy to read text, scroll, big images - each with their own gallery arrows, and a ton of white space. Clean and simple... a match made in heaven for Google's brand attributes.

    #clean #simple #refined #lessismore

    Visit this page >

  • 7. Jean Helfenstein ~ NZ

    Client Page: Pick One

    Jean Helfenstein's site has no direct links to the project pages which is just fine because this site is worthy of a serious look-through. Right from the get-go you know this site is going to be special and it does not disappoint. When you're done drooling, simply choose one of the works and check out the portfolio page designs to view them. Be sure to scroll and see the horizontal scroll in action.

    #innovative #visuallyspectacular #fullscreen #fx

    Visit this page >

  • 8. Super Top Secret ~ USA

    Client Page: Rossignol Snowboards

    Admittedly this is a case study vs a standard client page but who's counting? Super Top Secret's page for Rossignol Snowboards sets the standard pretty high with parallax, a soundscape, gorgeous typography and wonderful background illustrations. A class leading portfolio page design that demands the client's attention.

    #polished #soundscape #visuallyspectacular #comprehensive #illustratedbackgrounds

    Visit this page >

  • 9. Aerolab ~ Argentina & USA

    Client Page: Xapo

    We love the use of minimalism at the beginning of the scroll to help the user absorb the statistics, themselves elegantly animated without superfluous flare. Not shy on content either, this is a mighty scroll that provides the client with plenty of confidence in their decision to hire the designer long before they reach the end. Excellent presentation, rhythm and appropriately styled to the client's needs.

    #blackandwhite #minimalist #fadeincontent #brandstory #comprehensive

    Visit this page >

  • 10. Hue_ ~ Poland

    Client Page: Paulaner beer

    We had a hard time picking the best client page design from Hue_’s very impressive portfolio. In fact the whole site is addictive, but in the end we decided on this page due to the extra punch brought on by the sumptuous use of red and expansive visuals. This page does more than simply display the client's product, it celebrates it.

    #bold #colorful #fresh #comprehensive

    Visit this page >

  • 11. Jean Maxime Brais ~ France

    Client Page: WorkflowGen

    Luscious photography, big fullscreen visuals and vivid colors make for serious eye candy on this page for WorkflowGen by Jean Maxime Brais. The right dash of whitespace brings balance and poise to this high impact piece of impressive digital creative.

    #visuallystunning #fullscreen #icons #vivid

    Visit this page >

  • 12. Apt ~ Norway

    Client Page: Prosjekt Fantasi

    It's often the little things that bring the best effect, like Apt's portfolio page for Prosjekt Fantasi. Look for the neat 'slide down' div after clicking the play button on the video. Incorporates excellent video work with Apt's fresh design ethic and that certain Norweigein 'something'.

    #clean #simpleUX #subtleparallax #colorful #video

    Visit this page >

  • 13. Miguel Trias ~ Spain

    Client Page: ADL Palma

    Miguel's portfolio features classic aesthetics and elements but as with all great design work, it is Miguel's personal touch that gets this page on the A-list. Subtle fade-up scroll effects and use of white space make this page pleasing to scroll through. Nice work.

    #minimalist #clean #nicetone

    Visit this page >

  • 14. Dunckelfeld ~ Germany

    Client Page: Bulls

    Dunckelfeld's superlative page for Bulls ticks all the boxes needed to please the client and then some. Unlike some of the other big and bold pages in this article, this page has a touch more UX via multiple buttons positioned throughout the page and subtle but novel hover effects. Solid design with good energy and a stunning outcome.

    #photographic #fullscreen #colorful #3Dbikeview #video #comprehensive

    Visit this page >

  • 15. Plug and Play ~ UK

    Client Page: Nour El Nil

    Portfolio page design 101. This page by Plug and Play has all the best elements needed to impress any client. High impact full-screen photo, one colunm text box for a description, brand design teaser, color and pattern palette guide, the word 'Responsive' above the website screenshot (I know, clients don't care but we do!) and mobile usage shots. Lastly, a call to action. Great job!

    #simple #fadeupscroll #greatcontent #brandstory

    Visit this page >

  • 16. Method Studios ~ NZ

    Client Page: Honda Pioneer

    The peeps at Method utilize the energy inherent in the color red to infuse this page design with power and impact, a clever strategy given the hero is Honda's Pioneer MUV (and red being a Honda brand color). Scrolling down invokes a color change in the background which acts to spotlight Honda's logo. The page ends with another excellent hero shot, this time emblazoned against the crispness of white space (desktop ref.). All of this combined ensures a happy bunch of Honda executive peeps. Golf anyone? Think I'll swap my cart for one of those MUVs.

    #highimpactcolor #brandfocus #goodstrategy #short&sharp

    Visit this page >

  • 17. Flavien Guilbaud ~ France

    Client Page: Suspended Animations

    Accomplished art director Flavien Guilbaud enlisted the help of Florien Morel (interactive developer) and Baptiste Briel (front end developer) for this superb piece of web design and developement work. Flowing through the chosen client page is facilitated by a horizontal scroll that is silky smooth, even when viewed via good ol' Firefox. So few elements but such a powerful piece of digital art.

    #innovative #stylish #horizontalscroll #silkysmoothfx

    Visit this page >

  • 18. Lab21 ~ Greece

    Client Page: Harbor Suites

    There have been some very nice additions to Lab 21's site since it won WOTD some time ago so you might want to start at the home page and have another look too, some sublime stuff here. Our focus is client presentation via the portfolio but we love the portfolio page so much we've supplied that as the link. Once there, select Harbor Suites. Meticulously designed and executed, this page demonstrates Lab 21's style that combines thoughtful graphics with their signature minimalist/scientific aesthetic. A minimalist call to action contact form meets prospective clients at the end of the scroll.

    #unique #meticulous #greatpalette #minimalist

    Visit this page >

  • 19. Indicius ~ Argentina

    Client page: ESPN

    Hot off the keyboard is the new and absolutely amazing site by Indicius. Take your time snooping around then head to the portfolio and select ESPN. Spacious, on trend and another example of meticulous execution. This is the kind of page the client sits and stares at for some time, simply lacking the 'files' to explain why they love it. Designers & developers know.

    #fresh #fullscreen #bold #colorful #meticulous #justlaunched

    Visit this page >

  • 20. Gladeye ~ NZ

    Client Page: Vodafone

    Gladeye from New Zealand begin this portfolio page design for Vodafone with a wonderful illustration that deserves deconstruction due to the subtle power it has on the viewer. Notice how the curved water and angled dynamic of the red Vodafone sail add a kind of 'natural pressure' to coax your gaze downward? This in combination with the white space presented above the fold (desktop ref.) aids the decision to scroll via subtle energy lines that guide the eye to the centre title then down. Whether intentional or a fluke, design gems like this are rare and worthy of mention. Scrolling down does not disappoint thanks to the design team's great use of composition and visual story telling through whole page - all the while keeping the focus on the hero, the client's brand.

    #colorful #personality #brandstory #illustratedbackgrounds

    Visit this page >

  • 21. Piotr Swierkowski ~ Poland

    Client Page: Cube of Speed Sounds

    Piotr's work seems to being going from strength to strength and this client page design is no exception. Green on green and oh so sharp. Relevant design focus, light on text, flawlessly executed. Definitely a happy client at the end of this paycheck.

    #sleek #minimalist

    Visit this page >

  • 22. Coralie Castot ~ France

    Client Page: Oracle

    Paris based artistic director Coralie Castot's design for Oracle is the way we like it. Bold and unique. It takes courage to attempt design work like this and that earns big respect points in our book - and most likely in the client's book also.

    #visuallyspectacular #subtleparallax

    Visit this page >

  • 23. Knock ~ USA

    Client Page: Levi's Revel

    Knock are renowned for their own unique style which is put to masterful use in presenting Levi's Revel range. Running like its own commercial, the page flows Levi's brand attributes seamlessly into the digital space which is why we had to include it in this article. The page acts like a teaser with splashes of movement that add drama accompanied by subtle yet sexy photography. An obvious client pleaser.

    #photographic #blackandwhite #video #dynamic #brandfocus

    Visit this page >

  • 24. Bonhomme ~ France

    Client Page: #GIFMYLIVE

    Different clients have different brand attributes which can often be hard to accommodate within a portfolio that needs to cater for variation. Bonhomme know this which is evident in this piece with its captivating yet sublte use of parallax and animation. Love the graphic shapes and visual referrence to GIFs. Top marks!

    #minimalist #subtlefx #eyecandy

    Visit this page >

  • 25. Anakin ~ Germany

    Client Page: Côte&Ciel

    This page design demonstrates what happens when minimalist chic meets style and grace. The result? A fluid page with enviable sophistication that reminds us how good a simplified portfolio could and should be.

    #clean #minimalist #brandstory #video

    Visit this page >

  • 26. Frank Digital ~ Australia

    Client page: What's On In Sydney

    The real magic starts a scroll or two down on this page, where glorious full screen color graphics take the client deep into the project they just shelved out the big bucks for. Not too little and not too much, this page provides exactly what the client needs to see, the energy of the client's brand and of Sydney itself emphasized via dynamic graphic angling and eye catching elements.

    #colorful #fullscreen

    Visit this page >

  • 27. Urban Influence ~ USA

    Client Page: Wood Shed Production

    Attention to detail and thoughtful story telling imbue this portfolio page by Urban Influence with warm and fuzzy notions of a simpler life. Generous photographic work guides the scroller down to a subtle revealing of the passionate craftsman behind Wood Shed Production. Polished to perfection, the page ends with some serious smarts by providing a mini-contact form, share links, unmissable 'Visit Wood Shed' button, and some elegant prompting to explore more work examples. Well done guys.

    #photographic #fullscreen #comprehensive #story

    Visit this page >

  • 28. TAOSTUDIO ~ Italy

    Client Page: Psykea

    Italian designer Michela Chiucini's TAOSTUDIO site is a tasetfully different take on the ubiquitous Designer's portfolio. When you enter Michela's site, you are entering her world. We chose the letter P for our fav client page design over the other letters mainly because of the original color palette and overall exemplary presentation. B and W would be our next favs, which is yours?

    #original #greattone #minimalist

    Visit this page >

  • 29. Visual Soldiers ~ USA

    Client Page: Zegg

    The crew at VS surely nailed this page from a client's point of view by meeting the number one client request right off the bat - "can you make the logo bigger?" This is a short and sharp page with a polish all its own and laser-like focus on the client's brand color as a highlighting feature.

    #minimalist #subtleparallax #brandcolorfocus

    Visit this page >

  • 30. Alexis Rousseau ~ France

    Client Page: Hubertine Auclert Center

    Fans of purity in design will love this portfolio page by Alexis Rousseau. Classic elements such as meticulous presentation and a good amount of content make this design a great 'portfolio design 101' example.

    #brandstory #originalpalette #fullscreen #minimalist

    Visit this page >

  • 31. C2 ~ Croatia

    Client Page: Vivaci

    C2 are a self-proclaimed dynamic duo of code and uncluttered design consisting of Ana Travas and Sergej Skrjanec. This page design features a horizontal scroll as a way of presenting the client work. Chosen imagery provide some insights into the project but it's the innovation of the site that would leave the client smiling.

    #innovative #short&sharp #horizontalscroll #classy

    Visit this page >

  • 32. Alexander Engzell ~ Sweden

    Client Page: Mond

    If you're a fan of edgy design then this page by Alexander Engzell should be on your look-list. A key point of difference here is the diagonal swipe effect to introduce content. A rock solid color scheme and bold graphics are finished off nicely with a money shot of the logo 'M' to finish the page.

    #edgy #dynamic #angulargraphics #fx

    Visit this page >

  • 33. Coulee Creative ~ USA

    Client Page: Blossom Yearbooks

    A great mood shot sets the tone for this page that provides expansive promotion for the client. Coulee have done an excellent job of presenting the client as the true hero of this page. Background color switch-outs, fresh graphics, and seamless video top-off a well executed outcome.

    #clean #comprehensive #energetic

    Visit this page >

  • 34. VerbalVisual ~ Germany & USA

    Client Page: Main Page

    VV's portfolio has a check-worthy feauture for inspiration in the form of the scroll stopping at the start of a section item but allowing the screenshots for that item to continue to scroll, then at the end of the screenshots the portfolio section is released back into the scroll - clever and underated. Just keep scrolling the page and you will see the effect in action. Clients may not notice this subtle but sensible feature but we certainly did.

    #justscroll #simple

    Visit this page >

  • 35. dimension ~ Spain

    Client Page: The Candy Project

    Yes the title grabbed us but not as much as the visuals that seem to leap right off this bold and tasty portfolio page by dimension. Add a sprinkle of video and a glaze of parallax and you've got a nice bowl of eye candy ready to serve to the client.

    #colorful #fresh #highimpact #fullscreen

    Visit this page >

  • 36. SOON_ ~ UK

    Client Page: Resident Advisor

    London peeps SOON_ tell a nice visual story and wrap it in a very appropriate urban-chic aesthetic for this folio page design. Logo insights are a nice touch for the client and those business card designs are sweet. Screenshots of tweets about the project and a good testimonial end the page well for prospective clients.

    #simple #brandstory

    Visit this page >

  • 37. Adoratorio ~ Italy

    Client Page: Bersi Serlini

    This is a 'short and sharp' portfolio page design that relies on a big, bold and gloriously colored illustration to capture the viewer. After starting to scroll we are greeted by some illustrative animation to enhance the subject matter while at the same time display Adoratorio's unique style.

    #illustration #minimalist #colorful #shortandsharp

    Visit this page >

  • 38. Cuberto ~ UK

    Client Page: IBOXPRO

    We've included a number of clean designs in this article for their use of space and color, but mostly because they would certainly please the client. This uber-clean page design by Cuberto is no exception. No more words are needed.

    #clean #colorful

    Visit this page >

  • 39. Frank Collective ~ USA

    Client Page: Muhammad Ali

    Brooklyn and L.A. based Frank Collective get a nod for using this client page to tell the story of Muhammad Ali. Rich in facts and wrapped in stylish graphic design, this is a nice layered approach that would probably see the client, Authentic Brands, do that marathon handshake thing clients sometimes do when they are happy with the work.

    #storygraphics #comprehensive #clientfocus

    Visit this page >

  • 40. Tool of North America ~ USA

    Client Page: AIRBNB

    Tool utilized their substantial creative prowess to full extent in their work for AIRBNB as displayed in this video. We chose this piece because rather than the std video teaser & plug for the client, this friendly walk-through style video cleverly begins by dealing with a challenge the brand is (or was) facing and then proceeds seamlessly into telling the story of how the work was created. Due to the complexity of the project we can see why video was the best choice in getting this information across quickly to visitors of Tool's portfolio. In seconds we learn that Tool combined film, animation, WebGL, real-time data visualization, iconography, a reactive sound engine that plays multiple soundscapes depending on the user's interaction, and more in this top shelf project. To top it off, stats of the impressive results to the campaign are shared to back it all up. Such a breadth of info could not be easily assimilated via standard web page design without overloading the viewer. Point made.

    #video #innovation #happiestclient

    Visit this page >

Go to Top