Posts Tagged ‘developing’

Awwwards day 2

The second day of the conference started with coffee & cookies :)
InstagramCapture_7c7d4a29-44a8-41db-9c85-1301ffae288a

David Vogel – “Zen and the Art of UX Design”
The First talk of the day mainly focused on the interaction and relation between computers and humans. The computer has become smart. The lines between what a machine does and what people do are blurring. The internet of things is coming. This already shows in the upcoming of AI and VR. Prices are going down. Soon it will cost the same to makes project with a chip as a project without a chip. To understand the complexity of it all David mentions holism and reductionism. Explain the parts through the whole or the other way around. When working on a project you start with the experience flow (spine) and then the story mapping (ribs).

WP_20160129_10_53_11_Pro
Greg Barth – “Do It Yourself, Design, Taking risks, Experimenting, Behind the scenes”
Greg Barth focused his presentation more on his own work. He presented his bizarre surrealistic colorful projects in a fun way. The Great thing about Greg’s work is that he loves to do everything himself. By using fish wire and things as projections he creates very unique experiences. Have a look at his work: www.gregbarth.tv

WP_20160129_11_09_53_Pro
Patrick Hamann – “Embracing the network”
This talk focused mostly on the failing of the network. Each website does a lot of requests to third party websites like advertising. On the 12th of November the main advertising site went down and as a result loads of websites showed blank pages while waiting for the server. You can’t stop failure but you can, and have, to embrace it. You have to design for failure. A good example is loading up a skeleton screen before the real content has loaded. This way the user knows that there is actually something going on instead of starring to a white screen. Also designing the error page is something that is often forgotten. Another part is embracing failure by using tools like pre connect,preload and prefetch to already load content before its needed in order to give the user a fast experience. Also caching is very valuable, especially when we look at the future where we’re also more focusing on offline experiences (push notifications and background sync of websites, not just apps).

WP_20160129_12_22_45_Pro
Bart Van de Wiele – “Adobe’s UX design future: Project Comet”
Adobe is working on a brand new project especially for web designers. Bart gives us a look at the alpha version. The project looks very promising. Comet works perfectly together with files from other Adobe programs like illustrator. It’s easy to move things from an Adobe project to comet. Comet of course also has the ‘standard’ design tools you need for UX design but also provides new things. One function even got a big applause: The repeat grid option. This option makes it very easily to repeat blocks in both horizontally and vertical grids. It also gives good control over the gap size between the items. Also when you change one item in the grid, for instance the image height, the other items will change too. Comet also gives nice options to drag in images and text. When dragging into the grid, comet automatically fills all instances with the images. This makes it easy to fill your design with the right content. Comet also has a great prototyping mode where you can link the different art boards together and use the simulator to show the interaction between the pages. They also offer a share prototype so the client can also have a look via adobe’s servers. All and all a very promising program. http://adobe.com/go/projectcomet

WP_20160129_12_39_47_Pro
Trine Falbe – “Designing (non-game) web interfaces for children”
Kids nowadays grow up in world of internet. By designing websites for children you have to take in account that they don’t think the same as adults. Most kids under 12 years old primarily use tablet. Their motor & language skills are not fully developed yet. Don’t use complicated navigation. The reason why kids click everything they see (like advertising) is because the ability to think in an abstract way only starts to develop from age 12. Our brains aren’t fully developed until the age of 26! Kids can learn sign language before they can speak and read. Therefore it’s important to use visual language like icons & images. When you can’t read very well you start looking for visual hints like icons and buttons. The same things happens when we, for instance, try to find our way on a chinese website. The main important things to keep in mind when designing for kids:
– Don’t reposition key navigation
– Visual language outweighs text language
– Use autocomplete and visual search (and use translations aswel so kids can search in every language)
– Use icons & images
– Simple data entry (because of motorskills, it takes a kid way longer to type something)
– Design for social (kids use websites together, they want to share and comment).
Trine also wrote an article about this on Smashing Magazine: https://www.smashingmagazine.com/2015/08/designing-web-interfaces-for-kids/

WP_20160129_13_11_14_Pro
Bjarne Christensen – “Why being a web professional is about to become even more fun”
Bjarne told about how his company changed the way they handle projects. Building sites is more than design & code, and you should find a way to make that clear to clients. Otherwise you”ll be spending a lot of your own time and budget on projects. You should come aboard early in order to define problems together with the client. Who are the users, what are the goals? By using keyword clouds and polar charts you can easily define what direction the project should go.It’s also a good idea to work with both fixed and agile budgets. The fixed part is for the process of defining the project together with the client. This part also gives the client understanding of the whole design process. For the second part you split up the project and estimate how long each part will take (min & max):

WP_20160129_13_16_09_Pro
Another thing that helps save time is to stop creating templates in photoshop. It’s better to create a look & feel by designing different element and by putting these aspects together after where designer & developer work closely together.

WP_20160129_15_46_35_Pro
Chris Heilmann -“All the small things”
Chris focused his talk on the fact that the web has become obese. Small interactions make things human but lately websites fill their websites with gimmicks. A lot of websites make the loading times, because of this ‘fat’, the users problem by displaying spinners and loading bars. Also a lot of those website look great on desktop but when it comes to mobile you have to wait a long time for all the javascript and images to load while ‘eating’ your data before you can finally find what you’re looking for. On mobile you want quick access to information. Lately more sites show up that only work in a certain browser. These are not websites but prototypes, Chris says. We live more and more in a ‘Creative Monoculture’. We forget that there are still a lot of people & places with bad connections. An example is Ignite: a dating websites. The company first focused on the american people. When they didn’t get the results they wanted they threw even more money at the project without result. Then they had a closer look at their analytics and found out that they had a lot of visits from countries like India. That’s when they changed their target group from the USA to India. India is one of the countries that is now starting to use internet more and more. But the connections in those countries are not very good yet. We have to take that in account. Not just for them but also to get rid of the ‘fat’ of the web. Chris sums up the mistakes a lot of site make:
– Images: Use of big png’s instead of jpg when there is no transparency needed, highres for every device (there are a lot of tools to automatically convert images and serve them to the right devices, why not use them)
– Javascript: Social media trackers, Loading in a lot of unnecessary libraries, for instance to support old ie. “Why the hell would you support ie8? We don’t even support it anymore” Chris says.
– Video: autoplay, loading big videos as fancy backgrounds
– Fonts: Loading a whole font while you’re only using a part of it (just the numbers for instance)
Some more tips: Provide back-up for slow connections and older browsers. (like a normal background for a gradient). Use newer elements like flexbox. This way you don’t need big javascript plugins anymore. Use the picture element and build in plugins (like in wordpress) to serve the right size of images. Understand language: for instance red means ‘good luck’ in China while we know it primarily as a color for ‘danger’ and ‘alerts’. Use face recognition and image analyses when needed so users can for instance easily tag people without having to tag the same person over and over again.
Know the limits of environments and connections. Don’t fill everything with gimmicks.

Resn – “Perverting the Web”
Resn showed a couple of example on how they ‘pervert’ the web. They take whats beautiful and misuse it. In this way the created bizarre, unexpected projects to engage, to surprise and to disrupt.

Prize-giving Ceremony
I expected a bit more of the price ceremony. According to the schedule it would take an hour but it was finished within 30 minutes. There were 7 prices to be awarded in different categories. The name of the winner was called, the winner said a few thanks you words and that was it. I would have expected at least something visual: a small preview of the winning website.

The Party
The party was a good place to start networking and talking to people. I had a very nice time and met some very nice people. :) Hope to you see guys again some time at another conference.

Conclusion
Overall the Awwwards were a very nice experience. The talks were all about different subjects and the speakers had different points of view which was quite interesting. The talks were both inspirational and educational. Some talks were more structural and showed how to do certain things like ““Dirty Little Tricks From The Dark Corners of eCommerce” and “Embracing the network”. Others were more focused on inspiring people by showing projects like the works of Greg Barth, “Fusing Code and Celluloid” and “Virtual Reality: Evolving Narratives”. Others focused on other aspects than just the web itself like “The Future of the Web is Printed” and “Kickstarting your Sketching and Visual Thinking skills”. All in all I had a very nice time, learned a lot and saw some very inspiring work.