Motion Design, the future of web

See this great interview with Rich Fulcher a thought full speaker with lots of great tips to any designer.

I'm not really a huge fan of Material Design or Google design decisions in general. It's never flawless and to many visible mistakes. Hard to pinpoint a good example, but there's a lot (why isn't there a google image search for iPad?). I know they user test a lot, but hmm, still there's some strange over locked stuff.

Anyway, I like his conclusion, that I also can stand by, is that animation, or motion design is the future on web forward. Still lifeless slides is about to end.

I'm working on new ways of using animation and there will be some work presented in the future. But for now I have two great examples: https://www.filmskolen.no (scroll down and up and look at the logo) and Vibble app intro: https://www.vibble.co (Just download the app and see :)

Rich Fulcher leads Material Design and Engineering at Google. In this episode, he walks us through the story of how Material Design came out, what's involved in building your own design system, and the importance of investing in your design culture and how you grow talent.

Photo by Edho Pratama on Unsplash

New Office in Media City Bergen

I've moved to a new office, and I'm now located at Media City Bergen.

All the big media companies has an office in the new building from NRK, TV 2, BT +++.

I'm in tower 3 in the shared office space at BTO (Bergen Technology Transfer a startup helper), and if you what to say hi, just come by! :)

foto: Simon Brandseth, UiB.

Remove dust and scratches in Photoshop

In this tutorial I show a trick that makes it much easier to see details that you feel but don't necessary see. By using curves it reveals problem areas that is hard to see. It's not a quick fix solution but it's a good solution.

And I also talk about why you , as a 3D artist of some sort, should do photography and also how to tell simple stories by adding the right details.

I'm close to a 1000 subscribers and as you may have heard, YouTube has added a new ceiling for moneytization on videos, so I need more followers to reach that goal. So hope you can share my videos and of course subscribe :)

Why I returned a Dell XPS 15 - 2017 model

I have researched for a new laptop computer for a while, maybe two months. As usual I don't make any hasty decisions for my tools. For years I've been using a MacBook Pro 2011 laptop, it's still in use, but it's time to let it go.

I use Cinema 4D, and the future of 3D renders seems to go ta a GPU accelerated, or a combination with GPU+CPU. My need for a future proof computer is important and that's why the new Macs are useless, to old specs and not future proof. My next computer needs to have some sort of CUDA cores, that's a NVidia technology, and are not on the Macs. On the new Macs they've also gotten rid of that MagSafe, that has been a really smart safety function (been used so many times, not on purpose), and the touch bar seems useless to me.

So I found a work horse, that has everything I need for the future and more. A Dell XPS 15, 4k screen, 32 GB ram and other high specs. But sadly without a MagSafe function, but I can live without that.

I'm used to a MacBook pro and it's build quality and I were shocked how crappy the touch pad were. The Dell XPS 15 picked up fingers that weren't even touching the pad, and often it didn't recognize that I were using the pad at all and I had to drag and drag to get it started. The XPS also has a touch screen that work really well, and since that were so great it demonstrated clearly my frustration with how useless the touch pad were. This irritated more and more.

The material of the computer of it's felt really cheap plasticy. I knew it were plastic, but it's worse then expected from all the review I've read. Not exactly Mac quality.

View fullsize

And the worst problem. Cinema 4D, my main program for work, on Windows 10 in 4K resolution, it's so blurry. Yes, everything is so soft and impossible to look at it's hurting my eyes. It turned out that the way windows is "zooming" doesn't work with C4D and the program isn't ready for 4K yet. A Windows 10 problem, I've seen it on MacOS and it looks good on retina-screen. There's also so many functions native in Windows 10 that isn't ready for 4k resolution either, so the whole OS has a design flaw. I would recommend not to buy a Windows 10 with an 4k screens yet.

Happily I could return the computer without any problem.

Now I just need to find a new laptop.

Why you should stop using Chrome!

Over a couple of weeks I have tried to fix an image problem. All the images I uploaded to a site looked really blurry on Chrome. Of course this post can be out of date any day, but February 2018 this is relevant :)

Chromes doesn't handle image scaling very well. These days with responsive design, we design sites with percentages, will sites and images be shown in many different sizes. It's crucial that everything looks good on any platform.

View fullsize

View fullsize

Firefox 58 and Internet Explorer 11 (haven't tried on Edge or Opera), look like expected, small size thumbnail images is crispy clear.

But Chromes result looks out of focus and horrible. Yes, this can be seen as nitpicking, but as shown in the picture above you can see the difference clearly.

And weirdly enough theres is an easy fix, and why this isn't standard on Chrome beats me.

To gain a better result, add this code to you CSS:

image-rendering: -webkit-optimize-contrast

View fullsize

View fullsize

Since most sites don't have this image-rendering CSS added to their site, you are guaranteed that the web looks worse on Chrome. Use Firefox! :) Images in Firefox are even sharper than the image-rendering enhancement.

View fullsize

Here I flip between Firefox, IE 11, Chrome and Firefox

View fullsize

Here I flip between Chrome and Firefox

PS: I have nothing to do with firefox, I only want you to have the best web-experience possible :)

Color - Animated shorts sizzling with knowledge

I came across this series with highly effective animated shorts about color. Every transition is a joy to see and the content magnificent.

And read about the subject over at CNN

Take a look at learn a lot!

Colorscope is a series on CNN that explores our perception of color and its use across cultures, one shade at a time. Inspired by our love for The Purple One we chose the last color on the spectrum, a marriage of opposites, a mixture between the hottest color and the coldest. http://www.cnn.com/2017/08/04/health/colorscope-purple/index.html For full credits visit buck.tv

We love CNN's Colorscope series, and were very excited to be asked to contribute. Here is everything you ever wanted to know about pink, but were afraid to ask. See the other colours here: www.cnn.com/colorscope ----- CREDITS Client: CNN Creative Producer: Sarah-Grace Mankarious Directed by Giant Ant Creative Direction: Jay Grandin Producer: Liam Hogan Storyboard: Conor Whelan, Jay Grandin, Marion Bordeyne, Eric Pautz Art Direction: Eric Pautz Illustration & Visual Development: Eric Pautz, Marion Bordeyne, Conor Whelan, Shawn Hight, Sitji Chou, Whitney Lam Animation Direction: Conor Whelan Animation: Conor Whelan, Shawn Hight, Chris Anderson, Henrique Barone, Matt James, Taylor Peters, Whitney Lam Compositing: Conor Whelan, Eric Pautz Sound Design: Bryan Stone

Short history of the colour black made for CNN as part of their Colorscope series. Direction, Design and Animation by Matt Abbiss Produced by Sarah-Grace Mankarious Animation by Marta Reis Andrade Sound Design by Bryan Stone Music by Giacomo Smith 2017

YELLOW is part of the Colorscope series by CNN. "They call it mellow yellow". The short documentaries about different colours shows us on this episode how the colour yellow makes us happy, is on the most visibles hues and it's relation with science and religion. Created by Sebastián Baptista Producer: Sarah-Grace Mankarious Writer and Narrator: Dr. James Fox Music: Giacomo Smith Sound Design: Bryan Stone Special thanks to: Andy, Pini & Javi

The Dark Truth Behind White Working with CNN I directed and animated an episode of Colorscope, a series exploring the secret truths behind colour. Client - CNN Production - Sarah-Grace Mankarious Direction / Animation - Jocie Juritz Writing / Narration - Dr James Fox http://edition.cnn.com/specials/arts/colorscope-series http://www.jociejuritz.co.uk/CNN-white

"Green, the mixture of blue and yellow, can be seen everywhere and in countless shades. In fact, the human eye sees green better than any color in the spectrum. But why is that?" I teamed up (once again) with the amazing Rafael Mayani for this short piece commissioned by CNN International to explain the so-familiar colour, green. Producer: Sarah-Grace Mankarious Written and Narrated by Dr. James Fox Animation: Jorge R. Canedo E. Design: Rafael Mayani Music: Giacomo Smith Sound Design: Bryan Stone

"Blue is the world's favourite colour" We worked with CNN and Dr. James Fox to produce a film for their Colour Scope series. See the website here: http://edition.cnn.com/interactive/2016/12/specials/colorscope-blue/ Produced by Sarah-Grace Mankarious & Moth Direction & Design by Moth Animation by Moth, Joe Bichard, Jennifer Zheng, Aaron Lampert, Carlos De Faria, Stephen McNally, Ester Rossi Sound Design by David Kamp Music by Giacomo Smith Client - CNN Production Year - 2016

The 8th episode of CNN Colorscope explores the allure of Gold; worshiped by pharoahs, Aztecs and millennials alike. See the series on cnn.com/colorscope Producer: Sarah-Grace Mankarious Writer and Narrator: Dr. James Fox Director and Animator: Tim Booth Music: Giacomo Smith Sound Design: Bryan Stone

Colorscope is an award-winning series exploring our perception of color and its use across cultures one shade at a time. Orange is the colour of sunsets, budget airlines, traffic cones and protestants, but it can also be toxic…! http://edition.cnn.com/2017/12/06/health/colorscope-orange/index.html Credits Writer and Narrator: Dr. James Fox Producer: Sarah-Grace Mankarious Production Company: Nexus Studios Director: Emmanuelle Walker Producer: Greet Kallikorm Production Assistant: Islay Leefe-Griffiths Executive Producer: Chris O’Reilly, Charlotte Bavasso Production Company: Nexus Studios Studio Lead: Elliott Kajdan Art Direction: Emmanuelle Walker Animators: Claudio Salas, Emanuele Romano, Pierre Rutz, Emmanuelle Walker Motion Graphics: Elliott Kajdan, Abel Kohen, Emmanuelle Walker Sound Design: John Black Music: Giacomo Smith

I worked with CNN on their second film for the Colour Scope series. The bar was set super high after the amazing job Moth Studio made on the first piece. Direction and Design by Abel Reverter Produced by Sarah-Grace Mankarious Animation by Abel Reverter Music by Giacomo Smith Sounds Design by Bryan Stone VO by Dr. James Fox Special thanks to the amazing Katie Menzies, Fabian Friedrich, David Elósegui and everyone that helped giving advice during the process at Pamplona 89. All the episodes at cnn.com/colorscope Client - CNN 2017

https://vimeo.com/channels/colorscope

Scrolling web-animation for DNF

I've been working with Neue on several projects this year and now a new part of my work has been released. It's logo web-animation to the site Den Norske Filmskolen (DNF).

This project I needed extra reinforcement because it needed java scripting, and my buddy Ola Marvin Leier were up to the task. I made the animation of the DNF logo and he did the scripting trickery to make the logo move and behave as we wanted it. When you scroll it activates the animated sequence, and to add some randomness if you reload or explore the site the animation have different states. And maybe the best part the size are tiny, for the animation around 18 KB.

This is a relative new way of creating flexible and tiny sized animations for the web using After Effects, bodymovin and java scripting.

See the logo animation in action here, and remember to explore the site:

Vibble app won a DogA design award

My connections to the Vibble app is many. I've done work directly with SoundIO that produce the app, making a logo introduction for the app using bodymovin for After Effects, and I've also made a presentation video for Neue that shows the brand identity.

So I sort of win a DogA award too :) !

I made this brand identity video presentation in collaboration with Neue for the Vibble App. The app is mixing made easy using streaming services combined with dj functions.

I created this short and sweet logo reveal for the Vibble app, an app that simplify DJing