Project

Design and animation for an educational website devoted to life and movies of the famous film director Stanley Kubrick.

Idea

The initial idea was to create something extraordinary in terms of design and at the same time insightful in terms of content. It could be a website about a famous photographer, artist or anyone else connected with art.  Stanley Kubrick and his great works eventually matched all our criteria to create an interesting piece of work that would be not only good to look at but also interesting to read. There was no commercial or business goal behind the project: only creativity and the wish to share something cool and useful with the others.

It was Stanley Kubrick’s 90th anniversary when we started to work on Kubrick Life in 2018. It was a great honor for us to be the ones who eternalize his art on a well-designed website. Considering that Stanley Kubrick is one of the most influential filmmakers in history, we thought that there are a lot of admirers who would be thrilled to learn more facts about him and his art. On the other hand, some people might get more interested in Stanley Kubrick once they check kubrick.life.

UX Design Process

The idea was to create a complete and consistent story. Keeping in mind that Kubrick was a great filmmaker, the designers wanted the whole website to feel like a movie, allegorically.

The website features:

• the milestones of Kubrick’s life and career
• chronological filmography
• interesting numbers and facts about the filming process, cast and directors’ nature
• numerous archive photos and film episodes
• gamification elements

The narration was performed in chronological order and featured his films and some interesting facts to make the story of his life more enticing. From one movie story to the other, the readers get familiarized with Kubrick’s traits and techniques as a film director.

Stylistically, the designers added background noise, picked a quite old-school color palette and also worked thoroughly on typography to create this old movie-like feeling.

One of the things to mention is the scroll animations experienced by the readers along all the way. As the website performs as a huge long read, we needed to find a creative way to separate the films so we’ve come up with some unique animations for each film title. Another user-experience aspect is hidden stones like “Escape it” labyrinth that makes the interaction with a website more engaging and fun.

Among the hardest points for designers, there was that all the Kubrick’s films are of different genres and styles, they reveal different times as well. The most challenging aspect was to find a unified style to make all these films look consistent but still unique. They spent almost 3 months choosing the appropriate concept.

To reach “the movie effect” we used the infinite scroll as the main navigation element that takes us through the story of Kubrick’s life and filmography slide by slide. In the end, we found out that our long read is more than 300K pixels long! There is also handy side navigation for a more convenient experience. And some 3D graphics were specially created and integrated into the interface to make some episodes even more atmospheric.

The advantage of the creative team was the absence of time constraints because the project was in-studio and non-commercial. The only issue was to find the needed time and establish the point when the website could be considered done. Anyway, now when the website is live we are still working on polishing it.

The whole website has been built entirely on a Readymag platform with some custom HTML/JS/CSS code injections.

Also, one of our graphic designers Arthur Avakyan, being inspired by the website, created the stylized digital portrait of legendary Stanley Kubrick.

As soon as Kubrick Life was released, the creative team got the recognition from the community: it got the Site of the Day Award on The FWA as well as the Site of the Day and Developer Award on Awwwards. Later, it was also awarded by Webby and Red Dot.

So, welcome to check all the details of Kubrick Life by yourself.

Design Case Studies

If you are interested to see more practical case studies with creative flows for mobile and web design, here is the set of them.

Nature Encyclopedia App. UI Design for Education

Florence App. Illustrations for Healthcare Service

Inspora. Brand and UI Design for Virtual Stylist

Bitex. UX Design for Stock Analysis App

Slumber. Mobile UI Design for Healthy Sleeping

Real Racing. UX and UI Design for Mobile Game

Tasty Burger. UI Design for Food Ordering App

Watering Tracker. UI Design for Home Needs

Originally published in Tubik Blog

Сообщение Design Case Study: Educational Biography Website появились сначала на Design4Users.

To support this idea, here at Design4Users, we launched a new section called “D4U Expertise“. It will collect diverse ideas, talks, cases, and tips from expert designers presenting various directions of design to help users. Ultimately, we are going to have here the set of materials that will be helpful and inspiring both for experienced professionals and for those who only start their path in any of the design directions.

This post aims to draw your attention to a worldwide known and recognized graphic designer, Chip Kidd, a person of great talent and amazing humor.

Biography

According to his personal website presenting the incredible variety of his works, Chip Kidd is an award-winning graphic designer and writer in New York. His groundbreaking book jacket designs for Alfred A. Knopf have elevated the form for close to three decades. He’s worked with hundreds of writers, including John Updike, Katharine Hepburn, Cormac McCarthy, Henry Louis Gates Jr., James Ellroy, Karen Russell, Michael Crichton, David Sedaris, Sharon Olds, Orhan Pamuk, Paul Simon, Neil Gaiman, and Haruki Murakami. His first novel, The Cheese Monkeys, was a national bestseller. His most recent book, Go: A Kidd’s Guide to Graphic Design, is the first book to teach graphic design to children and has over 60,000 copies in print.

As an editor and art director for Pantheon Graphic novels, he’s worked with and published some of the very best cartoonists in the world, including Chris Ware, Art Spiegelman, Dan Clowes, David Mazzucchelli, Charles Burns, Michael Cho, and Alex Ross. He is the recipient of the National Design Award for Communications, and his TED Talk has been viewed over 1.3 million times.

He has produced so many recognizable graphic design ideas for book covers that plenty of people worldwide know those images, although they have never heard the name of their creator. he deeply believes that the cover is a piece of functional art, the chance to attract readers with a memorable first impression given to the book by the designer. Even more, the book cover should give a mental and emotional message from the very first seconds of its meeting with a reader via its title and cover.

Let’s take a look at some of these famous covers that have become a great blend of art traditions, careful analysis of the book itself, and creative experiments that brought the world new “Kidd’s philosophy” of book cover design.

Book covers by Chip Kidd

The designs, featuring some of the huge collections accomplished by the designer over the years, are presented in random, non-chronological order.

Ted-talks

Ted-talks by Chip Kidd inspire a huge number of artists transferring precious practical tips and personal experience. They definitely differ from usual lectures or public speeches by means of his humor and non-standard performance. However, with him this trick works and the jokes create a good contrast to highly serious messages he transfers to the audience.

This is one of the funniest talks from TED2012, where he shows the art and deep thought of his cover designs and also makes you smile and laugh all the time.

The stories can be anything, and some of them are actually true. But they all have one thing in common: They all need to look like something. They all need a face. Why? To give you a first impression of what you are about to get into. A book designer gives form to content but also manages a very careful balance between the two. (Chip Kidd)

So even though we love publishing as an art, we very much know it’s a business too, and that if we do our jobs right and get a little lucky, that great art can be great business. (Chip Kidd)

In this hilarious, fast-paced talk, he explains the two techniques designers use to communicate instantly — clarity and mystery — and when, why and how they work. He celebrates beautiful, useful pieces of design, skewers less successful work, and shares the thinking behind some of his own iconic book covers.

Clarity or mystery? I’m balancing these two things in my daily work as a graphic designer, as well as my daily life as a New Yorker every day, and there are two elements that absolutely fascinate me. (Chip Kidd)

Lectures and interviews

Here we have also collected several videos giving more insights of Chip Kidds life and professional path and containing a great deal of useful tips for designers based on extensive practice. Enjoy!

Lecture at Hammer Museum

Chip Kidd interview: What the Stories Look Like – Conversations from Penn State

Chip Kidd Insights Lecture

Chip Kidd’s speech at OFFSET 2009

Shelf Life 2: Chip Kidd

Image Credit: Hammer Museum

Get inspired, stay tuned, don’t miss new stories about inspiring experts!

Recommended links:

Chip Kidd’s official website
Chip Kidd: Go Ahead and “Judge This” (interview)
Chip Kidd on Twitter

Сообщение D4U Expertise: Book Cover Design by Chip Kidd появились сначала на Design4Users.