Website, Crit

I brought forward the desigs and scamps I had drew up to the crit. I had also digitised the design.
I thought I liked it but when I got to the crit I realised I really didn't.

It was very plain, not interesting, didn't look like a website and was boring. I said this in the crit was given a few more ideas to think about such as;

Having a busier look to it, using a maybe a four by 5 grid
Using colour to highlight and be navigation 
Making it have more of a blog style look to it

Looked at a couple of websites I visit to get an idea of their layout

This is the digitised version of on the pages. It's definitely too basic, the images of too big, it's not interesting to look at and doesn't really explain anything. Where I wanted to have the information and links to websites etc is quite big and would not look good.

Design decisions -

Keep the horizontal lines to show a time line concept

Keep the idea of colours for each catergory but find better mixes

Have more images on the pages

Blog style layout

Website, Designs

To start with the design process I drew up some scamps to get an idea of how many pages I wanted, how the scroll would work, what the basic look of the webpage would be and to understand the whole navigation of the website.

My original idea was to have a colour for each page, so to separate them. I drew out some designs I had pictured in my head. Then digitalised them.I think when I drew these ideas up, I thought thats what each webpage would look like, with the colour going round but after a minute I realised that it wouldn't work because a webpage doesn't really have a boarder around it.

Design decisions - 

Horizontal scroll, I want to use a scroll like this because my website is all around the idea of a time type line. So as your on the website you're going along the time line. 

Name -  It's a play on words of time line but tells the audience exactly what it is about, 'Typeline'

Colours - I want to use a few colours to differentiate each type of typography I will be showcasing. This will keep the page organised and looking good.

Navigation - There will be no obvious buttons, but the headers for each category will be a button and it will take you to the pieces of work


Style Guide 

Study Task 07 - User Experience Design

User experience is the way the product works with the user. How they have perceived it, how they worked out how to use it etc. This applies to my website it is important that the website it easy to use, its clear and navigation is simple.  I want the experience to be good enough that people actually get involved. In other websites there isn't a submissions page, and because of this I need to make sure my website is interesting enough to upload work to. Personas are a generalisation of a type of person that you want to connect with. Like a target audience, I have considered mine audience a lot throughout the whole design. This is because I want my website to look like it belongs in the typography part of the internet so that people won't click off it. It needs to be recognisable so people who go on typography blogs and websites will relate to it rather than confused. Task flows are a map of decisions and reasons behind it. It keeps the main point, purpose of the website, in the forefront while you design everything else. This will be useful to use so I don't get distracted and remember exactly why this website needs to be on the internet.

Study Task 09 - Search Engine Optimisation

Search engines use algorithms to work out the suitability and rankings of a website because of the search terms.

SEO is system to change websites to the match the criteria used by search engines when they use 'crawling' on the web content. 'Page Authority' is the ranking of how much a web page is searched due to SEO, linking internally and the relevance of the content. 'Domain Authority' is the ranking of a web page based on size, popularity and age.

• violations -irrelevant/weak content
• off-the-page factors - links, trust, social, personal
• on-the-page factors -HTMK, content and architecture

SEO is about making your website better, they are small changes that separately might not be noticed, however together they can make a big impact on the sites experience and performance.

Concentrating on small changes might not be that good because it might not give the best result.

Page titles are indicated by title tags -  they tell users and search enginges the particular topic of the page  <title> <head> use brief but descriptive titles

 <meta> is desriptive tags giving an idea of whta the page is about. It's simple to understand URLS 

URL can be cut down to the essentials 

Two site maps are used, the first is for users and search engines and the second, lowercase is a page that shows the stucture.

Navigation is natural and flowing, with organisation freshness.

Anchor Text - suitable anchor text makes it easy to convey the contents linked. Use clickable text <a href="..."></a>

Images are called 'alt' and should be optimised.

Possible Changes to my website to help optimisation 

• create <title> tags for each particular topic of the page, for example 'sacred geometry' and 'orion mystery' 
• make sure all my image have a distinct filename and 'alt' attribute.

Digital Print Workshop

CMYK colour mode for print

Commercial Print?

Offset Lithopgraphy

Digital Print

Screen Print

Need to think of Colour as Ink

illustrator

Create new swatch

Create a colour from the colour bar and save that to a swatch

You can add your colours into the swatch bar, if you haven't stored your colours before

Global swatch means if you have a shape with the same global swatch, you can change the shapes' colour at the same time

You can save swatches 

Spot colour is an ink that is used instead of or in addition to CMYK

Web Style Guide [ Study Task 08 ]

Style guide for my website

Considerations

Font families - Header and Body

Colours - RGB/HEX, background, foreground, palettes

Button styles - Colour, image; Default, hover, active

Logo and variations

Grids/ Layouts/Variations/Sub pages

I found this quite hard because I didn't really understand how to go about web safe fonts etc

I think this looks quite simple but it can change, especially after a crit

Study Task 06 - Rotation task - New Media Theory

Should we be so upset about the loss of MSN Messenger?

Posted by Liv Siddall, Wednesday 03 September 2014

This week Editor Liv Siddall addresses the world’s distraught reaction to the announcement that MSN Messenger will terminate after 15 years in operation, and wonders if we should get so nostalgic and wet-eyed over technology.

I often think about what the world’s headlines and Twitter feeds will be like when the Beanofinally holds up its little hands and admits defeat – there will be cries of outrage, people pointing fingers and mourning a lost nugget of their past. Problem is, none of these people ranting about it will have actually bought a Beano for about the last 20 years.

Similar feelings arose in me when I heard last week of the demise of MSN Messenger. The initial feeling of “NOOOO!” was soon overtaken by the incredulous realisation that it has actually still been going all these years – who the hell has been using it? I’m not going to bore you with a bunch of “remember how you used to put song lyrics as your profile name?” or, “remember when you used to sign in and out again so the person you fancied knew you were online?” – I’ll leave that to Buzzfeed.

What I do want to address though is that I am 25, and I’m pretty sure I was in “the” MSN Messenger generation. A lot of my friends and co-workers of a similar age have expressed sorrow and nostalgia for its demise which, if you think about it, is a bit weird. MSN Messenger was a basic, rather ugly tool that was hosted by Microsoft in order for you to chat online with friends pre-Facebook and everyone having a phone – it wasn’t a family member or a much-loved celebrity.

After probably not even thinking about it for a decade it seems odd for people to get riled up about something terminating. What it does hint at is the amount of people between 20 and 30 who are now starting to form serious bonds with technology having been breastfed by it as a teenager and then never actually weaned off it.

The BBC even got their technology reporter Dave Lee to write an obituary for MSN Messenger! As if it was a person. You’ve seen how inconsolable your friends are when they lose their phone, or worse an important file or entire digital music library. Are we getting a little too attached to technology? The turnaround of old and new tech is increasing incredibly fast – even the whole scrolling website format is getting stale and that’s only been going for a few months.

Should we be nostalgic for technology or should we just move with the times? MSN was a good friend once upon a time, but I probably wouldn’t bother meeting it for a pint now, or attending its funeral to be honest.

I've chosen to look at this piece about the termination of MSN because I was an avid user of it and understand what this article is trying to say. It is a new and weird occurrence to be emotional upset that something on your computer doesn’t work anymore.

     Social media is ever growing and becoming a more consuming thing in normal everyday society. The normality of taking a photo of something or someone and uploading it to the Internet for millions of people to see is a very new concept. Ten years ago, the normality was to take a photo, wait till the film ran out, get it developed, and put it in a book and not look at it for years. Now it’s pretty much the same apart from you take a photo and store it for the world to see and still not look at them for years. Since the Internet became so popular and new media was formed people lead a very public life. This is important to look at when designing for new media and understand what is appropriate. Social media is a very public thing, where as specific design blogs or website not really. Websites that are for viewing and not communicating can be private about certain information. With each new media format there is a new media audience. A lot of the time it can be very specific, a lot of non creative would not of heard of Creative Review even though it is a huge global website. New media depends on its audiences to make it work. MSN was understood and loved by many because it wasn’t specific it was convenient and useful.

     In new media there are a lot of different websites or apps etc for different people and their interests. Understanding this means it will help the design process of a website. It will ensure the correct audience is approached with useful and interesting information.

Search Engine Optimisation

What is SEO?

Search Engine Optimisation 

Search Engines use algorithms to access the suitability and ranking of websites on search terms
SEO can make changes to websites to match the criteria that search engines use to find the website

Page Authority - how likely a webpage would be ranked based on certain SEO 

Domain Authority - how like a domain is ranked 

What affects a SEO ranking?

On the page factors
content
HTML
Architecture

Off the page
Links
Trust
Social
Personal

Violations
Irrelevant/weak content
Spam
Paid for links

Additional research of SEO: strategies and effectiveness
Make a list of potential SEO changes 

Meta tags - Gives a summary of your page -  make is relevant and unique about the webpage
Use a meta tag to tell search engines and users about your webpage

URLs- make sure they are clear and easy to get to. It will keep the webpage organised and easy to understand
Keep it short and simple and unique 

Navigation - plan your navigation around your home page
Breadcrumb lists help the user navigate and get back to a page easily

URL parts can be removed -  a user doesn't have to put the whole lot in, so prepare for a cut down version

Prepare two sitemaps, one for users and one for search engines. Lowercase sitemap is a simple page which displays the structure. 

Responsive, SMART

Specific - Details exactly what needs to be done
Measurable - Achievements can be measured in terms of units or specific success criteria
Achievable - That resources, scope and scale are within your capabilities or capacity
Realistic - The objectives are possible to attain - which is important for your motivation
Time Bound - The period of time, target dates, schedule or timetable is clearly defined.

Responsive J2O - Ideas

I started by stripping back the design to get rid of all the colours and look at the shape and overall design. However I prefer to work by hand, so stripped it back more by hand. This helped because I was able to draw a few roughs out and think about what I wanted to do before I did it on the computer.

I then thought of just suggesting the logo, because I personally don't like. I thought it would be easier to have it descreetly. I sent this line drawing to a handful of people to see if they got what it was, and many did so thought I'd keep going.

Here I used the original colours of the art work for the lines, I like it, it definitely proves I need to use colour. But it doesn't have to be in this way and not the same colours.

I then played with a drop shadow, to create more shape and add colour to the design. Varied the colours from the flavours and original 

I then thought of using watercolour to add texture and create a fusion, like the fusion of the flavours. For this prototype I used an image of google, however, if i go for this design I will make my own watercolour that really communicates the flavours.

Using other colours to demonstrate the other flavours.

I drew this outline up in order to have the colours around the logo. Making the shape a well known one and very recognisable.

Began by seeing the outline of the shape with a basic colour.

I added the background and cut round the edges

Discovered the clipping mask technique which create a much neater look.

I added the white to the 2 because I think thats the most significant part of the logo. It's a number rather than a letter and stands out the most.