#brazilianwax

Live Project Tweaking

After last week's crit I had a few things to change to garvan's website. Some of the major issues that Chris and Nick had with my website included the font colour that I had chosen and the vertical alignment of the different elements on the page.

I had originally used Raleway Thin as my body copy font with the #ccc shade of grey which was way too hard for anyone to read. To combat this I changed the copy font to a heavier type named Open Sans Regular and also darkened the colour to #666.

The Alignment was an issue that Chris picked up on that I hadn't spotted. Every element on my pretty much had a different margin to each other and made the page look messy. To fix this I messed with the grid and margins to tame them back into place.

Major Project Proposal

This week I started to think about my MPP and what exactly I needed to talk about within each section. I'm going to have to think about it over Christmas to get it all sorted for the hand in in January.

Some of the things that I will have to research before I can start my MPP are Gantt Charts as I've never made one of these before. From what I know, it's essentially a chart with your timescale along the top and the activities that you need to complete in a list on the left side. A Gantt chart can be as simple or as complex as you want it to be, but for my second semester I think I better create a complex one just so that I know what I have to do each week. This will take some time to plan out. Examples can be seen below:

Simple Example of a Gantt Chart

Complex Example of a Gantt Chart

Gantt.com, 12/07/2011, Gantt Charts - Gantt Chart Information, Gantt Charts History, and Gantt Software- Gantt.com [Gantt Charts - Gantt Chart Information, Gantt Charts History, and Gantt Software- Gantt.com ], [online]. Available: http://www.gantt.com/.

Future and Emerging Technologies

Although I have complained about my other modules, looking back now at the work that I have completed for Com522 I can see how useful it will be to me for my MP. As I chose the topic "Augmented Reality for Smartphones" I had the chance to look at many apps and the capabilities of each. I am starting to get very excited about learning how to create apps and hopefully this will be something that will benefit me in finding work later in my career.

I also found the report writing nature of the module has allowed me to further my writing skills. This will no doubt be invaluable to me for my future career also, as Nick and Chris mentioned in week 8 the importance of writing appropriate and considered copy. Not only will this assist the user in their journey through your website, you can also get paid for providing this service too. A very useful online service that I used during this module was WriteCheck.com. It allowed me to not only check the plagiarismsimilarity of my content but also checked my grammar to make sure everything that I had written was correct.

#thecritique

Live Project Website

As this week started I really got stuck in to coding up my website. I decided on creating a one page website as Garvan didn't have very much content for each of his sections. I started by inputting all of his content into the various tags and then found a great smooth scrolling jQuery plugin that I could use to make everything scroll that little bit smoother. I found it on Css-Tricks.com

Once I got this working, I decided to try and implement the grid system into my design. I used the 960 gs as it's one of the only grid systems that I have experience with. I decided that each section should have two divs sitting next to each other, one holding the content and the other holding a few appropriate images.

The next thing that I added to my page was a "To Top" jQuery button that appears onscreen once you've scrolled down to a specific point in the content. I found it quite hard to implement at first as it was using a different version of jQuery library than I had linked to in my page but I eventually found a work around that allows me to link to more than one library without all the different codes conflicting. This addition really adds to the minimal feel as it reduces the need for hard coded anchor points to bring the user back to the top after each section.

The next stage of design was to set up a jQuery slider to showcase garvan's work at the top along with the homepage information. I had previously used the NIVO image slider in my own portfolio redesign so I decided to use it again. It's got such a beautiful and minimal interface and so I thought it would be just perfect to use on garvan's site.

I have probably created this site in a quite backwards way, but as soon as I got all the elements in place, I started to think about the type I wanted to use and the personality I wanted to portray. One thing that Chris had mentioned in the client brief last Friday was the Germanic roots that were in garvan's past, so I decided to try and show this in the design. I used the colour red along with the different shades of grey and decided on Open Sans Bold for the headings type and the Open Sans Regular font (Google Web Fonts) for the copy. I also added an extra font for the quotes as I thought they should stand out from the other two fonts. I used Lobster Two (also Google Web Fonts).

Branding Ideas

As I started the week off I found it very hard to sit down and create anything good in the branding department. Most of the ideas that came to me were based mainly on garvan's initials, leaving me with a page full of monograms. I also had a few ideas of using his name as a logo, but by the end of my experimentation with his name I kind of came to a loss after exhausting all of my ideas. I started looking at his work and came up with some cool little German looking logos that were also based on his exhibition work. I think these are my strongest but I will just have to think about it some more before the final hand in! Hopefully the Feedback session this Thursday will be useful!

Logo Options

Logo Recommendations

Colours and Typography

#buildabrand

Build - A - Brand

During this week's lecture we were firstly told about our Crit next week, where we need to have our website and branding ideas uploaded so that we can receive feedback on them. 1 WEEK! It's not going to be marked or anything just yet, so one should be enough time to get the website up & running and the branding ideas on its way... Right?... I hope so!!

"Products are created in the factory; Brands are created in the mind"
- Waltor Landor

We looked at designing a brand identity at the beginning of the lecture this week, and learned that a brand identity is more than just a logo. It's about the experiences and senses that are stirred when thinking of a particular brand. We looked at looked at 3 different websites and the brand identity that their website conveyed to their users. First off was Primark's website, where the whole drive of the website is the emotion to buy things cheap and quickly. On the complete opposite side of the spectrum is the website of Howies, where all of their clothing is quite expensive but you get them in the best possible condition from the start, which then allows you to hand your items down through generations.

"A logo is a point of entry into the brand"
- Milton Glaser

Live Project

This week I started thinking about some ideas that I had for the live project website after we had our client brief with Garvan on Friday. He said that he wanted a very minimal website, using shades of grey as the colour scheme. He also mentioned a love of techno music, going to Berlin in the 90's and how he's currently learning German. I have a few ideas, making the website in a combination of grey shades and white with a hint of colour. I'm thinking possibly red, as it really portrays a Germanic style in my opinion. I think I'll be looking at some of Jan Tschichold's work when I start working on the branding ideas.

#ninetofive

The Process

During this week's lecture, Nick talked us through the process of working in the web design industry. He mentioned lots of useful information but some of the things that I found to be most important was the statement...
"DON'T BE A DICK!" and the whole thing about being friendly and helping others. Karma will eventually get you back for all this good doing.

To get a job we need to be going over and beyond what we usually do, creating projects just to keep us on our toes, meeting new people (friend of a friend can always lead to new work and collaboration!). We always need to remember that our reputation goes before us, so always do your best, deliver on promises. A good thing to remember that Nick mentioned was "Under Promise, Over Deliver". That way expectations will be exceeded!

Facebook Developers

Another major part of my major project will be integration with Facebook. This will allow the users of the app to post which sessions they're at to their wall, see which of their Facebook friends are also using the app and use their profile photo as their profile photo on the app. I took a look at the Facebook Developers site and found a blog post from 2009 talking about the release of Facebook Connect for iPhone. The page also had documentation and code example links to download more information to help you use Facebook with your iPhone.

This is yet another feature that I will have to check out when I get my MacBook Pro over Christmas. I can't wait to start working on this app!

Gareth Davis, 14/03/2009, Facebook Connect for iPhone. Friends Now Included. - Facebook developers [Home - Facebook developers], [online]. Available: https://developers.facebook.com/blog/post/213/ .

#itsonlywords

Designing with Words

"Web design is 95% typography"
- Oliver Reichenstein, iA

In this week's lecture we looked at how are words and thoughts should be portrayed online to people who may be looking at our content. We need to think about this especially when Macrocopy (Establishes the tone and sets personality) and Microcopy (Reinforces tone and satisfies a function). The language that we use when writing this contentis also an important factor too as language differenciates the cost. The more thought that has been put into the language and design of a websites copy allows you to charge more for the service.

You can't fake that shit!

We also talked about the way in which many companies out there have made their name by portraying a friendly and caring persona via their websites. This may be a great advertisement for your company, but if you really don't care about the environment or being seen as friendly then you shouldn't try to. It looks worse if you are blantanly lying to your customers! We looked at a few websites that really showcased the best in friendly and considered design. For example, the language that's used in Flickr has been considered and portrays an informal, unique and friendly greeting to the user every time they log on.

Live Project

During our lecture this week, Chris mentioned our live project for the first time. He talked about how they had teamed up with a silversmith named Garvan Traynor. We should get 2 week's to create the branding and the website for Garvan, with the client brief to follow in the coming week's. I'm quite looking forward to this project, I just hope I have enough time to make it look good!... Although on inspection of his website at the moment, I don't think it could get much worse!

Major Project Proposal (MPP)

During the lecture this week we also got our MPP brief. It's due at the beginning of January 2012 (date yet to be set) and will be worth 30% of our overall marks this semester. We need to have certain components added to our report such as...

1. The Cover
2. The Lift Pitch (50 words)
3. Summary (250 words)
4. Research Outcomes (500 words)
• Research Analysis
• Target Market
• Techniques Used
5. Conclusion (200 words)

As well as all of this, the report must also have the regular sections like a Bibliography and Appendices etc.

#build

Objective C Time

Since there's no set material to be covered this week as the guys are away to Build conference I think I'm going to work on with my website to get it finished and also look more into the programming language Objective C to create my app. I found a great tutorial that introduced Objective-C and Xcode in a series of tutorials.

The tutorial talks about how Objective C is an "object-oriented extension to the C language" and states that you must be familiar with variables, methods, classes and object oriented programming. I believe that with my experience with JavaScript, ActionScript and the little bit of PHP coding that I learned in second year I should be OK to learn this.

From further reading I think this is going to be a useful little tutorial but for now I can't test anything out. Hopefully over Christmas I will be getting a MacBook Pro and so will be able to continue my experimenting then. Until then I shall read on.

OSCARVGG, 04/10/2010, How to make iPhone Apps – Part 1: Xcode suite and Objective-C | Mobile Orchard [Mobile Orchard | The iPhone App Developers' Blog: iPhone Programming, Developer News, Interviews And Tutorials], [online]. Available: http://mobileorchard.com/how-to-make-iphone-apps-part-1-xcode-suite-and-objective-c-3/ [10/01/2012].

Proper Wireframes

From last week I expanded on my wireframe sketches of the pages in the app and created a more realistic looking visual composition. You can see these below:

#thejourney

In this week's lecture we covered the 3 challenges facing web designers.

1. Designing with real content
2. Design Responsively
3. Designing in the Browser

Some of the problems that we face with each of these include designing content appropriately when the real content has yet to come in, for example using Lorem Ipsum can be useful to fill out websites that have no content, however when it comes to exchanging this dummy text for the real content it may not look right on the page. We also need to consider all the different devices that people view websites on, such as mobile and tablet etc. Do we need to have a mobile stylesheet or a completely different mobile website all together.

We also talked about choosing the right font for your design but also considering the platform that users are going to be viewing it on. For example, if someone is using a windows platform to view your website and they have clearfont turned off then they are not going to be seeing what you intended to convey.

In the second part of the lecture this week, we also had a lengthy presentation by the guys on "The Legend of Zelda" where each part of the story is vital to our lives and future. Once we have been taught by a wiser, older person who have more experience than us we are the free to embark on our own discovery in order to better ourselves and our talent. If we stayed in the one place constantly, we would never learn anything new.

BÖIKZMÖIND Screening

BÖIKZMÖIND - A Fixed Gear Bike is... from BÖIKZMÖIND on Vimeo.

On Wednesday afternoon of this week we got chance to take a look at Gavin Strange's documentary film about the fixed gear bicycle scene in Bristol. After watching the documentary it really put me in the mood to take up cycling from just hearing and seeing how passionate everyone who was interviewed in it was! All of the scenes were beautifully shot and the little interludes like the cyclists doing some shopping were beautifully laid out. Really glad I went to see it now!

960.gs

This week I also took a look at the 960 grid system that Nick talked to me about on Friday and decided to try and use it in my website design. On first look I didn't have a notion how to use it but after looking at the NetTutsPlus tutorial by Jeffrey Way I was more prepared to use it in my design.

Visualise

This week I thought I could start making up some sketches of all the pages I'm planning to have in the app along with wireframes to create the layout of my app and actually get the ball rolling. I started by making a sitemap with the flow of intended navigation stated. I then created some wireframes and visuals for how I envision it to look when I create it. Here are some rough sketches:

Below are some sketches of how I want the start/login, Registration and profile pages to look within the app:

...And here are some sketches of how I want the Map, Friends and Search Results Pages to look:

KristinaReilly.com Changes

Above are some of the new images that I've been working on to add into my website. I've been working on a new title banner for the whole website, as the plain text title isn't that visually attractive. After talking to Nick I've decided to reduce the size of my "Currently Reading" section of my blog by moving it all into a small banner image to the right-hand side of the content with just the images of the books within it.

#typemasters

In this week's lecture Chris and Nick talked about typography for print and design. We started off with Guttenberg, who as someone said in the lecture was the inventor of the first printable press in the West. This is when Typography first started. The display text letters were made from wood and the body text were made from lead. This reminded me of a video that I had seen on the Build website a while back named "Linotype: The Film". As I'm not going to Build I only got to see the preview on their website but it looks great.

"Linotype: The Film" Official Trailer from Linotype: The Film on Vimeo.

We also talked through the age old topic of web-safe fonts and the ways in which this can be combated now using services such as Typekit, Fontface, Fontdeck, Google Web Fonts, Process Type Foundry, Fontfont and Font Squirrel. I've used Google Web Fonts before and have actually been availing of one of their free fonts on my new website design, but after hearing what the guys thought of Google's service I've decided to take a look at all these other services before deciding on the typography for my website.

The Masters of Print

Adrian Frutiger - 1928

• Universe Typeface
• Frutiger Typeface

Wolfgang Weingart - 1941

• Playful with Typography
• His style was 20/25 years ahead of his time

Erik Spiekermann - 1947

• FF Meta Typeface - 1980's and used pretty much everywhere in Berlin
• Deutsche Bahn (DB) - based on ratios of the letter B

The Masters of Web

Khoi Vinh - 1971

• His website Subtraction
• Designed "The New York Times" Website
• Created the "Basic Maths" Theme on Wordpress

Jason Santa Maria

• The Rules of Thirds / Golden Section
• Shows us that you don't have to keep the size of type small

Mark Boulton

• De Standaard Website
• The size of type in relation to other types is considered and created to work. The type is so big that you're no longer seeing the letters as words; you can see the shape, form and colour.

Doing a lot with a little

We then started talking about how the little things make the whole website. The ingredients that we need are simply a well chosen typeface, a considered Grid and a restrained palette. Once all of these things have been put in place, you in essence have got yourself a website. We talked about Wim Crouwel during class and how he was one of the first guys to even consider typography on screen and also talked about his typefaces "New Alphabet" and "Fedra Sans".

An Sóisialta Seisiún

I didn't have the opportunity to learn Irish back in primary or secondary school so I'm blaming that (and Google translate) on this little mistake! I got talking to some Irish speakers this week about my app idea and it appears that "The Social Session" isn't "An Sóisialta Seisiún" as I thought but "An Seisiún Sóisialta" instead. Ah well, at least I caught it before anything was set in concrete!

Also for all those non-Irish speakers out there like me, it's pronounced "An Say-soon So-see-all-ta"! *practices in preparation of viva next semester*

An Seisiún Sóisialta... That's better

This week I started down the long road of learning how to actually create an iPhone app from scratch. With a quick Google search I quickly had thousands of pages in front of me telling me all sorts, so with my better judgement I quickly clicked out of that search tab and searched for "Smashing magazine iphone app creation" instead! I found a great starter tutorial by Jen Gordon which gives some pretty great advice not only with the programming bits-and-bobs but with advice on how to best make your app idea a reality!

Some of the basics that she lists in her article post include joining the Apple iPhone Developer Program, getting an iPhone/iPod and Mac and downloading the latest version of the iPhone SDK. It's quite daunting all of the things that I have to do to actually start creating apps... $99 a year to join the Apple iPhone Developer Program and £999 to buy a MacBook Pro. I'll start with tiny steps and start thinking about the MacBook first.

Jen Gordon, 11/08/2009, How To Create Your First iPhone Application - Smashing Coding [Smashing Coding - Client-Side and Server-Side Programming Articles ], [online]. Available: http://coding.smashingmagazine.com/2009/08/11/how-to-create-your-first-iphone-application/ [09/01/2012].

An Sóisialta Seisiún Survey

As I posted my survey online in week 4 I decided to check on it this week to see how many responses I had received. I had a total of 57 responses from people within the Trad community. Some of the most notable and helpful pieces of feedback that I received was that the majority of people are from Northern Ireland, 97% said they would find the app useful and the totals were pretty much even when it came to the functionality needed from the app. Oh and of course, the majority of people who took the survey had iPhone's so my choice of platform to create my app for has been justified!

Welcome to KristinaReilly.com

So this week I managed to get most of my website up and running! As for the Tumblr account I was using for my blog in previous week's, I've decided to scrap it and just use my website so if you are reading this now... Voila! Hope you like it! I'm still making minor tweaks to the site so if you do notice something please send me a wee email! Thanks!

After our lab class on Friday I had a talk with Nick where he looked over my new design and gave me some advice on how to make it better. He told me to have a look at the 960 grid system and try to use it in my website design. He also had an issue with my "Currently Reading" boxes as he said they were given too much importance over the headings. The Hierarchy of my site is something that I will have to look at also as some things are given a higher importance over others. He also asked me to rethink the blockquotes, the size of my type and to maybe use some of my banner work as the title of my website instead of the plain text. I have taken onboard all of his advice and personally agree with it all. Can't wait to get a chance to fix all of this for next week!!

Side Note

On Wednesday of this week my flatmate introduced me to a game that took about an hour of my life... But it was worth it! This cool wee game allows you to move letters into the position that you think is correct. Best score I've got so far is a 91 (Woop!), what's yours?

#thecontentmix

During this week's lecture we talked about how to achieve the best content mix on our blog. We are the curator of our content; everyone's blog is going to be different. We just need to consider what we talk about and how to convey this online. We need to write about the things that really interest us! No one wants to write about something that they don't like just because they think someone else might like it.

The aim of the lecture today was so that we start thinking strategically about how we portray ourselves online, and what content we use to do this. We should constantly try to vary the length of our posts from time to time as it gets quite boring if you come back to a website every day and see one huge post after another. Most importantly once we start our blog we must remember to sustain it. If we don't, then this portrays a lack of interest and gives the impression to the user "If she's not going to bother posting, then I'm not going to bother reading this".

Tumblr

So this week I decided to host my design blog on Tumblr. It's a great blogging site, really easy to set up and easy to use. The only problem that I face is trying to design my tumblr page from scratch and it's quite hard to try and figure out each of the variables and blocks that they use instead. I took a stab at changing the CSS but it wasn't different enough from the original tumblr theme for Nick and Chris.

Stop Motion

We had a very productive lab class this week! Juli, Jenne and I created a little stop motion video using about 20 photographs that I took on my photo while Juli scrambled to pose the little figure in different ways. To be honest it's not the best stop motion video that's ever been shot but it was fun to make and I guess we picked up on something that Tim and Gabe mentioned last week; Collaborate!

Major Project Decision!

It's OFFICIAL! I've decided that I'm going to go with creating a session finding iPhone app. It's something that I'm interested in learning and would benefit from if I had it on my own phone so who knows who else would benefit too! So this leads me to this week's work; create some questionnaires to hand out to people from the local Traditional Irish music community. I will have to think about which questions I should ask so that I understand what the app needs to have. Some ideas that I've thought of already are listed below.

The Most Important Questions

1. Are you male or female?
2. What age are you?
3. How interested are you in playing Traditional Music
4. How interested are you in playing in Music Sessions
5. How interested are you in using Mobile Applications
6. Where are you located?
7. Do you use a Smartphone? If yes, which?
8. Do you attend many sessions? How many?
9. Do you find it difficult to find out about upcoming sessions?
10. Do you think you would find a session finding application useful?
11. Which Social Networking websites do you use currently?
12. What functionality would you like the app to have?
• User Registration
• User Input and Recommendations
• Follow/Befriend Others
• Ratings
• Social Plugins (Post to Facebook/Twitter etc)
• Photo Sharing
13. Have I missed anything that you think would be important to the application?

Now that I have some questions I think I need to look into the best way to get responses from the most important people; the Trad Community! Two ways that I can think of are either online or good 'aul paper based questionnaire. To be honest I don't think anyone appreciates paper based questionnaires anymore so I think I will start researching online methods of collecting responses.

SurveyMonkey

During my time on placement I heard the name "SurveyMonkey" thrown around quite a few times in the office. The admin guys liked to use if to get feedback from students who had previously finished courses. On first look I have found that the free version only allows you to add 10 questions however to sign up for a pro account you must pay £24 a month for a basic pro package, with the gold account costing £299 a year!!! I think I might try and find some others online

Wufoo

The website for Wufoo looks great and really catches visitors attention. The interface looks good and seems easy to use. I must sign up for a free trial to see if it's any good.

After looking at both I think I might just stick to hosting my survey on SurveyMonkey. From what I know it is a great tool for collecting information and if the University has used it, it must be good! It's easy to use and 10 questions isn't a bad number if it's free! Now just to post the survey with the amended 10 questions and send to those who I most want to hear from. Below is a small preview of my survey.

I want to hear from you!

Once I finished creating the survey I decided to pass a link to it through Facebook to all my Trad friends to answer. As well as this I am also added to two traditional Irish music groups on Facebook and so decided to post a link to my survey there. Other pages that I subscribe to include the two Traditional Irish music pubs; The John Hewitt and Maddens bar. Let's just see how many people take an interest in this now!

KristinaReilly.com Progress

So this week I started to build my website, adding in all the finishing touches that the guys mentioned in week 2. I decided I wanted some jQuery somwhere in my website, so I figured why not use a sidebar slider to hold my social networking links. I found a great link online that gave me some instructions and sample code to integrate this into my own website. Below is a screenshot of it in action:

Parris Studios, 15/02/2010, Andrew Sellick's Sexy Sliding SideBar Menu in JQuery | Parris Studios [Parris Studios], [online]. Available: http://www.parrisstudios.com/?p=339 [20/10/2011].

I also managed to find some great social networking icons to use on my website too. All I had to do was change the colour to suit the colour palette.

IconsEtc, 26/10/2011, Glossy Waxed Wood Icons Social Media Logos ~ Icons Etc. [IconsEtc], [online]. Available: http://icons.mysitemyway.com/glossy-waxed-wood-icons-social-media-logos/ [20/10/2011].

#hurryback

The Working World

As Nick and Chris are away this week to Frontend, Tim Potter and Gabriel Muldoon hosted our lecture this week. I found this week's lecture to be very informative. The information Gabe provided us with is the type of stuff that we never really delve into while in uni. He talked about things like drawing up contracts, pricing freelance work, the wage differences in working full time & freelancing and even the best methods of taking payment once you've completed work for a client.

Lab Class

In this week's lab class I got chatting to Gabe about my MP ideas. I figure it's better to bounce my ideas off as many people as I can so that I know that I'm getting the best chance at creating something good. He listened to all of my ideas but since I have no experience with apps, and the fact that the Ocarina-inspired idea is quite ambitious, Gabe suggested that I stick to the Idea that I will have a better chance at making perfect and enjoying; the Tin Whistle / Flute tutorial website. I'm not quite sure if I want to do this.

I understand that the tutorial website is probably the one project that I would have a fair idea of how to do but I think I would benefit most from learning to make an iPhone app. Final year is about challenging yourself, and learning to create an iPhone app will definitely be a challenge to me! I want to learn some new languages so that I've got a better chance of getting a job at the end of all of this! As Chris said in Week 1 "Shoot for the stars, you may just reach the moon".

We talked about Deadbeat Drummer, a student's MP from last year. He explained how much thought had gone into creating the total user experience in the videos and via the website. They took the time to choose how to get the right sound, lighting, filters to layer over the video at the editing stage, website colours, clothing and even the shoes he was wore in the videos. The smallest of details had to be perfect as they were trying to sell their brand.

I agree with him in a way as I do think I'd have a better chance at making the tutorial website, but I really love my session finder app idea. I guess the only way to find out what I want to do is by experimenting with everything now, while I have the chance to.

KristinaReilly.com Redesign

So this week I started to experiment with Adobe Illustrator to try and create some images I could use in my new website redesign. I found a great wee tutorial showing me how to create banners quickly and easily and so I created a few of these:

This was my first attempt, I used a clipping mask to add in the checked background image of the banner and then used the object > move tools to create the V at the end of the banner. It's a little too bland to add to my website so I tried something different in the next example.

In this example I started off by drawing a squiggly line using the pen tool in illustrator and then used the 3D > Extrude and Bevel effect. Such a simple technique for producing something so pretty! It even adds a gradient to the shape automatically. The only downside to this is that you can't really add anything else once this has been created. For example, I wanted to add a little red dashed stitching around the edges of the banner but I could now as it was created with the pen tool. Awh well, it's still a great wee technique!

For this example I followed the "Illustrator Quick Banners" tutorial I found online although I did add the clipping mask to it during the process. I really like the outcome of this experiment, and the inclusion of the warp effect has made this banner look so complete! I think I may use this or something like this as my header on my website.

Josh Duncan, 26/10/2011, Illustrator Quick Banners | Josh Duncan's Design Playbook [Josh Duncan's Design Playbook], [online]. Available: http://www.joshduncan.me/illustrator/illustrator-quick-banners/ [11/10/2011].

#thefluidweb

So this week in our DES lecture the guys gave us a sneak peer at "Designing the Fluid Web" presentation they're giving at Frontend this week in Oslo. After their talk I found myself focused on getting the new design of my portfolio website up and running.

Website Redesign

After the lecture I started thinking seriously about my website and how I could use the information that the guys mentioned today in class. I realised that in the past I had been making some of the mistakes that they mentioned in the lecture; thinking too much about the bells and whistles that you add to your website after everything else has been considered. I need to start off with the fundamentals first...

Hierarchy

After some thought I've figured out how I am going to divide up my page so that I get the most impact with my content. Below are a few sketches of some layouts that I have in mind:

 

Colour

The colours that I am going to use for my redesign are as follows:

I really like how each of the colours complement each other and aren't distracting to the eye. I've chosen this shade of red to break up all the shades of blue and I love the effect that they collectively achieve on screen. I've also got some background images created that I may use in my final draft.

Typography

I've put a lot of thought into the typography that I've chosen for my website as it's such an integral part of any design but I'm not sure if the guys are going to like it... I've used the "dreaded" fonts from Google Web Fonts. I personally like them but I'll just have to wait and see what Chris and Nick say. The two fonts are Droid Serif and Raleway

Composition / Grid

This is something I need to look at some more. I really want to get into the whole Responsive design aspect of web design but just haven't got round to this yet.... I've just read Ethan Marcotte's book.

Narrative / Storytelling

The narrative of my website is pretty much simple; Student Portfolio. This is something I really need to work on some more. As the guys mentioned in class, I need to start thinking about how I'm branding myself online and then how I portray this on my website. AAAAh so much to do!

Talking Through my Ideas

During the labs class this week I got chatting to Nick about my MP ideas. I talked through each of them, and as I am still quite unsure of which one I want to go with, Nick encouraged me to keep on researching the things that I am unsure about. He said to look at all the websites and apps out there that are similar to my ideas and find out what could be done better.

#thefinalcountdown

So this is it... What we've been working up to for 3 long years. Final year!
I have been dreading this year since I started IMD but now that it's here I'm going to make the most of it!

This week felt like Work Overload. It's hard getting back into the swing of things after my placement in Lifelong Learning last year, but I'm ready for the challenge. The introduction to the Module really opened my eyes as to what is expected of me this year. We we're told to learn something new, reach for the stars! That's what I'm going to do. Our first task set this week is to write up a pen portrait along with 3 ideas (with pros and cons) and 5 websites that inspire me.

Created using Wordle

Death Before Derailleur

We found out at the start of the lecture that Mr. Gavin Strange was talking at the Black Box so we decided to go and see his presentation. I've heard about design talks going on in Belfast through the twitterwebs but I've never taken the time to go and check them out, so this year is going to be different.

Gavin seemed like such a nice guy and you could see this coming through in his presentation. I really loved his "Death before Derailleur" and "Hello Sailor" illustrations and was really inspired by his why not attitude. Throughout his presentation he talked about how he got into doing illustration, filmwork and painting from being approached by people and simply agreeing. This is something that I need to do more... I need to start working on different types of design projects just because I haven't done something like it before and have fun!

Major Project Ideas

After a lot of thought I decided on some ideas for my MP, with Trad music being my influence for all three. Not sure if it's going to be a successful idea with Chris and Nick but it's something I'm really passionate about. We'll see how it's all went down next week I suppose! To kick start my research I began by searching for websites similar to my MP ideas and the things that I could improve on / add when I create my own.

Idea 1: Flute / Whistle Tutorial Site

This idea initially came about after seeing last year's project "Deadbeat Drummer". The aim of this website is to teach those of any age who are keen to learn how to play the Irish instruments using a combination of 3D animation and recorded audio. Some of the technologies I see myself using include Adobe Illustrator, 3D Studio Max or Maya as well as a recording studio to get the best sound possible.

Pros

• As a player and teacher I find tutorial websites like this to be a great learning resource and so I think others would too.
• I will get the chance to learn how to create 3D animations using programs I've never used before such as Maya or 3D Studio Max.
• I will get to work with Illustrator some more and really hone my skills.

Cons

• There are already quite a few websites out there dedicated to teaching web folk how to play tin whistle and flute such as "Whistletutor", "WhistleAway" and one of my personal favourites "Irish Flute Tunes".
• As there are different types of tunes (like Reels, Jigs, Hornpipes, Slow Airs, Marches etc) I may find it hard to find enough time to create an animation for each of these.
• 3D animations may make the website more "children-friendly", thus alienating an older audience.
• I haven't used any 3D animation software before and so the learning curve may be too steep and time consuming.

WhistleTutor.com

The design of this tutorial site has obviously been considered, with the big tin-whistlely-guy vector added to the homepage. This instantly draws people to view the rest of the website, where they find videos of the "Whistle Tutor" playing, a web forum for discussion and of course the fact that all the lessons are free of charge.

Some of the things that could be done better are the videos. The quality and setting aren't great and the sound quality can get quite unbearable when he reaches the high notes. The location he chooses to shoot the videos isn't great either. They're mostly shot in a dark room with a lamp next to him as his only source of lighting. This is something else that I will have to consider in order to get the best quality of videos if this is the route I decide to go down.

Sean Cunningham, 02/12/2000, Whistletutor - Irish tin whistle lessons and tutorials [Whistletutor - Irish tin whistle lessons and tutorials], [online]. Available: http://www.whistletutor.com/ [07/10/2011].

WhistleAway.com

This site is more of a community of whistlers that contribute their own videos to the website and the videos are categorised by difficulty. Again the quality of video isn't great and not very consistent with all the different players on the site.

Another let down to the website is the actual site design. There has been no real effort to make it stand out from other websites, and the text content just seems to be everywhere!

WhistleAway.com, 01/01/2008, Beginners Tin Whistle Tutorial with audio and animation | whistleaway.com [Irish Tin Whistle Tutorial | Irish Sheet Music for the Tin Whistle | Whistleaway.com2], [online]. Available: http://www.whistleaway.com/whistletutorial.asp [07/10/2011].

Irish Flute Tunes

This is one of my favourite free learning resources for the flute and whistle! I like the website design as it portrays very clearly to the user that it's Irish from the use of colour and images. The main attraction of the website is that Michael plays each tune twice in each of his recordings; slow first and then fast. This is a great tool for beginners but the website is lacking in visual representation to the tunes. The website would benefit greatly if he introduced some video or graphics, or even the sheet music to the tunes on screen as he plays.

Michael Clarkson, 01/01/2010, Irish Flute Tunes [Irish Flute Tunes ], [online]. Available: http://irishflute.podbean.com/ [07/10/2011].

The Whistler

The very successful Ocarina app from Smule has inspired me to take my Flute / Tin Whistle obsession to another level and possibly create a similar app utilising the sound of a Tin Whistle. It will allow the user to press buttons on screen while blowing into the microphone to make the sound of that note. It would most definitely be a novelty app for those who are curious about traditional music to use or for those who are seasoned professionals to play about with.

Pros

• I will get the opportunity to learn how to create apps.
• It will be a fun to use app for those who use it.

Cons

• I have no experience making Apps, and creating this will be even more difficult as I will have to figure out how to enable sound detection as the basis of this app.
• Again I will have to make it cross platform so that a wider audience can use the app. This will be time consuming and more difficult as I will have to learn how to create these apps as well.

Ocarina

I love this app! When I first found it on the App Store and downloaded it to my phone I was mesmerised by it! But the problem I face now is how I can replicate this app to be like a tin whistle.

I'm not sure what the first thing I have to do is to create something like this. This idea may be too ambitious but I'll keep on researching and see if I can make it work. Fingers crossed!!

An Sóisialta Seisiún

The aim of this App is to allow users to simply find a session based on the location they enter. It would act as a social networking app allowing users to sign up, add recommendations of their favourite session locations and follow fellow session attendees so that they're always informed with where the "craic's" at!

Pros

• It will be a great opportunity to learn how to create apps.
• Social Networking is very popular topic and so I may be able to work with this App after I leave University.

Cons

• I have no experience in creating Apps, I might find it difficult to learn.
• I will have to make the App cross platform for it to be accessible to everyone, which may be time consuming and more difficult as I will have to learn how to create these apps as well.

After looking through the App Store I haven't found any other apps out there like this one proposes to be. I think it would be a really useful for those hardcore session goes or even those who want to know where to go on the occasional weekend. Again this isn't going to be a small task and I will have to figure out how to actually create an iPhone app but I think I would really enjoy doing this as my major project. It's just a matter now of figuring out if anyone else would find it useful!

5 Inspiring Websites

Smashing Magazine

This is my first port of call if I have a query about something that I'm working on. It is the most useful resource I have found online. By following Smashing Magazine on Facebook and Twitter I can make sure that I am up to date with the latest web trends and technology.

CSS-Tricks

This website is a great learning resource for those who are having trouble with writing a piece of code or who just want to learn some new tricks for their next project. I found CSS-tricks to be so useful in placement year when I ran into a layout problem.

Web Designer Wall

Web Designer Wall was one of the first blogs I found online where every post gave me inspiration. I read each blog post with the enthusiasm of using it in my next project. If I ever feel like I am stuck in a rut with my design choices, I simply look to the Web Designer Wall to help me out and it never fails!

Spoon Graphics

My first introduction to Chris Spooners blog was back at the beginning of my placement year. His posts on creating Illustrator vectors pretty much taught me everything I know about vector graphics to this day. His tutorials are so inspiring as he always includes the little details that I would never have even thought about. I would definitely recommend Spoon Graphics to anyone who wants to create awesome vectors and learn some tips and tricks on Photoshop!

Web Design Ledger

I have a great love for WDL. On the eve of my placement interview with Lifelong Learning I read a post about web trends for 2011 and to my surprise I was asked about just that the next day! It not only provides inspiration for design, but also freebies, tutorials and tips for web designers.