Design secrets, Grids, Ideas and things.
I’m still managing to find new stuff to learn about Web development. These days it’s getting a bit harder to find completely new topics that I have not already read up about though. I’m interested in learning more about the backbone.js SPA framework and the Greensock animation library for example. I’ve mainly been trying to get some more motivation and inspiration to be more productive, so trying to be a bit more focussed !
Since my last update to this Blog I’ve covered responsive web designs, reviewed the essentials of Web design aesthetics and looked more in depth into how designers use Photoshop for Web design.
I recently spent the day at a Print design agency were they were some what less than enthusiastic about learning to code for the Web. The company has its own printing press and they are starting to see less and less print related work. Apparently companies making the switch to HTML Emails for their marketing has been one of their hardest hits.
It just makes we wonder though, is it easier for a designer to learn to code or for a IT Techie interested in Coding, to learn how to design ? Photoshop is the de-facto standard tool, however it has not really caught up with the responsive ‘mobile first’ design paradigm. Instead Adobe have created a whole suite of ‘Edge’ tools, including an interesting looking HTML5/CSS3 animation authoring thing.
Clearly Adobe is betting on a big future for HTML5/ CSS3 . Indeed who wouldn’t prefer to have a write once and run any where technology like that ? Why do you want to spend out on developing separate Android, IOS, Windows apps, when increasingly the Web is providing rich and performant API’s that offer instant cross platform compatability.
Design Aesthetics for the Web.
This is course on Lynda.com. Can I just get one thing off my chest before I go on. Why do Lynda reserve access to the Example code only for Premium Members ? This in my opinion is kind of like Ford trying to charge you extra to get an engine with you car !
Anyhow, having got that out of the way… I would have to say that this is indeed a great course. It takes a a true professional to cover so much detail all in just over 2 hours. I’ve read a few books on design theory relating to the Web before. It’s interesting to learn about such things as Colour theory, Typography and the elements and principles of design.
It does go to show that design is a skill that can be taught and learned like any thing else. I guess some people consider that it takes a certain type of ‘creative’ person to do this kind of stuff. It’s really interesting to learn the ‘language’ that designers use to talk about their designs.
The goal has to be to create something that the viewer instantly attaches to and that they feel compelled to explorer further. The elements and principles covered here are the tools in the toolbox, which when combined with trends and fashions can be used to ‘solve’ design problems.
The take home message is that when designing for the Web you need to be a bit original and really believe in what you are doing. I also see quite a bit of overlap with Photography which is another passion of mine. Many of the concepts photographers use in creating visual appeal are applicable to the Web also. It’s what attracts me to Web development though, the mixing of IT and creativity, enabling access to technology and leveraging advances. I really believe that learning all this stuff about the Web means being at the ‘bleeding edge’ of IT and will be for some time to come.
Photoshop for Web Design
This is another Lnyda cause that shows how Photoshop can be used for mocking up Web pages. Many designers ‘design in the browser’ these days, but PS still has its uses and the latest CC version has some neat new features for auto-generating Web assets etc. You can’t get away from the fact that mocking stuff up in PS does lead to a lot of duplicated effort, as more and more effects can be done using CSS.
Jumpstart Responsive Web Design
Wow, I converted this book to a (4 hour long) audio book and took it out on a hike around the New Forest ! It’s a great way to learn, especially when the Sun is shining, if a little intense . I find I am still absorbing the details two day later !
The fundamentals of RWD: fluid grids, Flexible Images, Media Queries and Dynamic Content.
Responsive web pages are the natural successor to fluid layouts. They differ from adaptive layouts in that they do not aim to target single specific devices. More over RWD uses different CSS depending on the width of the screen ( basically) .
To cut a rather long story short… Learn how to use the ‘responsive grid’ in the latest version of the Bootstrap frame work and you are most of the way there !