Vis Com 2 – Unit 7, Web Design

Unit 7 in the book Graphic Design School talks about Web and Interactivity. It covers all from a web designs project development to coding, programs, what to think about for a meeting to designing a website, phone app or iPad etc. Since web design is becoming a big part for companies and therefore becoming more popular within the design world it was helpful to read more details about what to think about and different options for different situations. The book talks about how the process to creating a well designed website starts with planning: meeting with the client to talk about the goal and what the sites´main focus is. Then comes the content gathering, flowchart (mind map), and contracting. After this comes the designing phase, including wire framing, design sketches and figuring out dimensions etc. When all this is decided and confirmed the coding is to follow, which most often includes HTML and it is therefore important and a great skill to know. Before launching the site it is important to have another person help testing it, looking for broken links, typos or something that might be non-working. After launching the sites it can be a good idea to give directions and training to the client, as well as following up on feedback from people who are using the site as well as from the client. The book also goes into more details about different programs for coding, different programs to create mock-ups and wireframes, the structure of projects, consultation, IA (UX), elements of a web layout, and the different in a web site, phone app and iPad.

Being that I last quarter took a class in creating a web site, as well as recently started working within web design, I wanted to look at other sources for more information about what to think about when designing a site and what is trending today. On the site http://dogulindigital.com.au/tips-techniques-creating-website/ we can read more about what elements are popular right now and how to best achieve them. Being that the web is constantly changing one has to always be on top of what´s new and trending, and things that worked a few years ago most likely won´t work today. What´s in today? On the site it is stated that “Firstly, there is a new protocol, HTML5. This promises to facilitate Responsive Design and integrate functions that once required browser plug-ins to work. Secondly, low-powered devices have stormed onto the scene and websites have to be optimised for smartphones and tablets.”(Dougulin digital). It is therefore important to keep up with the different evolving sites etc. As of right now, some of the best designs are focusing squarely on user experience and function. This means keeping a simple design that helps the audience use the device effectively and knowing where to click and what to do.

10

dd08ec883409c4502e2da0def73679d7

These two pictures shows examples on how one can treat going from a website to iPad, to iPhone. Since they all are different sizes it is important to consider their different layouts and how to treat different photographs, paragraphs etc. http://designmodo.com/responsive-design-examples/ 47524b86a0ba9fa973d1b6cf1f2d963d.jpg
This photo shows how a layout for the web looks with an organized grid. Even though it´s not a print it needs to be organized so that the audience easily knows where to look and so that it has a authentic look. It needs to be both visually pleasing as well as easy to navigate and understand. Source: http://uxmovement.com/wireframes/wireframe-effectively-on-the-new-improved-970-grid-system/

3503d0c9cd6babe48449f43a719f59ba
This picture shows an example of a website. I think it looks well thought out with negative space, good typography and buttons for a clear navigations. It also works with color scheme and photographs, to give contrast but still keeping it simple. Source: https://www.behance.net/gallery/22672365/Mobius-Responsive-Multi-Purpose-WordPress-Theme

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s