NTU Work

Artefact 5 – Social Hub

Moving away from the subject of social media marketing, for my last artefact I wanted to explore my other focal point of my research project. I have touched upon it briefly in artefact 2, and it is the idea that SNS’s are and will continue evolve. One aspect I highlighted to be something that is contributing to the evolution was social media marketing, but the other was the way SNS’s have started to merge media into one platform. One example I gave in my research document was how newspapers such as the guardian and The Independent have started to make their articles available to be read of giant of the SNS world, Facebook.

The aim of this artefact is to expand on this idea and to attempt to demonstrate how SNS’s may evolve as media via SNS’s is becoming more and more easy to share, and one type of media incorporating another starts to happen more and more. The artefacts shows a concept for a desktop application that could be installed on a computer or laptop to act the ‘social media hub’ for that machine. The users could view all they SNS’s they use and all types of media they view on a regular basis via one platform. The upside to this would be the interactivity the SNS’ and media would have with each other. The app allows the user to write a status that can either be submitted to Facebook or twitter, or both at the same time. Also available to the user would be YouTube and news widgets in which anything viewed on these widgets, whether it be a video or news article, could instantly be shared via both Twitter and Facebook to all their followers and friends. The purpose of this concept is to show how by merging all these aspects into one platform, social networking will become even more a part of everyday life.

Artefact 4 – Twitter App (Part 3)

As the previous artefact was demonstrating how easy and effective SNS’s can be as marketing tools, this artefact is carrying on from that, by showing how using the data and statistics collected from the SNS can show a business man exactly how popular and how much exposure his company is receiving, which can then allow him to make a good estimate on how well he may do for the following month etc. Using the twitter interaction format (@, #tags. Replies, Retweets & Mentions) to collect the information, this app then processes it to show statistically how much interactivity you have been having over the network.

The app first shows just the business’s statistics to gage their usage of the network. It does this by counting how many times the @cremebruleecart profile has tweeted, and how many times they have retweeted other people. By calculating this information it shows exactly how active they have been on the network that month. The app then compares the statistics to the previous month to show the exact increase or decrease of usage.

The app then collects all interaction with the @cremebrulee cart from other profiles. It does this by counting all replies, retweets and mentions the business has received that month. It applies the same system the previous statistics did, which is compare the information to that of last month, to calculate exactly the increase or decrease interaction with the SNS community. Once all this information is processed, the data is then displayed in line graph format so the results are again visually clear.

By being able to collect this sort of data allows a business to see exactly how their company is growing and gaining more exposure. This can then allow the business to make decision on how they approach their promotion.

Artefact 3 – Twitter App (Part 2)

The aim of this artefact is to demonstrate exactly how effective using an SNS to do market research for your business can be. With an SNS such as Twitter, gaining feedback from a large number of people quickly is extremely easy. Still using Curtis Kimball and the concept of the Twitter app, I aim to give an example of how this app could help a business collect data on their clientele. The app shows the statistics for a tweet that would have been sent out asking his followers their opinion on what new flavour he should add to his kart. By grouping all the information in one place, analysing and processing it, can give you solid data which you could then use to improve the way the business operates. The results from the replies to the tweet and grouped together, allowing Curtis to go through all of them and see what flavours are most popular. Once all the scores have been inputted to the system, the app would then display the statistics in pie chart form, so it can be visually seen what is most popular.

With this artefact I wish to show how SNS’s are perfect for businesses wishing to carry out market research. With such a diverse community and the platform to instantly interact with the huge number of people that use the SNS, it is perfect for any business, big or small to utilize as instant feedback is available, which is invaluable to any business.

Artefact 2 – Twitter App

This artefact is designed to show what it is like for the people starting businesses and using SNS’s to promote and market. As one statement I made within my research project was that SNS’s will continue evolving and social media marketing is one huge aspect that has the potential to help shape and mould future SNS’s to come. In recent years loads of worldwide companies have started to use SNS’s for advertising, and to generally try and stay prominent with the community today. This is the same for smaller businesses that are just starting out, as SNS’s offer a huge platform to interact with potential clientele. I found an example of a business that used Twitter to market and promote and has seen a be hugely beneficial.

I found this article: http://www.nytimes.com/2009/07/23/business/smallbusiness/23twitter.html. It is about a man named Curtis Kimball who started a crème brulee cart in inner city San Francisco. “For Mr. Kimball, who conceded that he “hadn’t really understood the purpose of Twitter,” the beauty of digital word-of-mouth marketing was immediately clear. He signed up for an account and has more than 5,400 followers who wait for him to post the current location of his itinerant cart and list the flavours of the day, like lavender and orange creamsicle.” Curtis Kimball started to interact with his customers using tweets to update them on his whereabouts and what flavours he had to offer. By using a service such as Twitter he is able to instantly inform thousands of people and being able to interact with so many people is exactly what a new business needs in order to get their brand out there.

This artefact is an example of how SNS’s could evolve as social media marketing becomes more prominent within social media as a whole. The artefact is a concept of an application that could be personally designed for Curtis Kimball to help him interact with his Twitter followers more easily. The app groups all information relevant to his business. At the top he can simply tick the check box for each flavour he has available on the cart today. He can then pin point his location using an inbuilt GPS map. Any voucher codes or promotions he decides to make available on the day, are also all listed allowing him to choose by ticking the checkbox. Once all the information has been input into the system it then generates a tweet containing all the info, this tweet can then instantly be submitted for his followers to view and interact with.

Artefact 1 - Survey

Research Question:

HOW ARE SOCIAL NETWORKING SERVICES FRAMING THE WAY WE ENGAGE WITH ONE ANOTHER IN SOCIETY, AND MERGING DIFFERENT TYPES OF MEDIA INTO ONE ONLINE SERVICE?

I thought the best way to start off my artefacts would be to do some research and acquire solid data that will help prove what I am trying to say in my research project. I decided to do a survey to find out the significance of social networking services (SNS) to a group of 20 people from different background and of different professions. Some were NTU students from the art & design department, some were working graduates and some were self-employed. I asked these 20 people 6 questions relating to SNS’s and recorded the results.

Question 1

This was my first question as I initially needed to gage how often the 20 candidates used SNS’s in order to make sure the survey will work. 80% of the 20 picked option a (every day) which showed me SNS’s are a part of everyday life for most people.

Question 2

Facebook and Twitter placed joint first for the most used. In my report I stated that Facebook and Twitter have both grew tenfold recently due to people waking up to the potential of using these SNS’s as marketing tools. This leads me on to my next question

Question 3

In my report I have said that SNS’s are becoming increasingly more popular to be used to promote and market products to a large audience. With the 2 promotional related answers to this question coming second and third I feel as though this shows that.

Question 4

By asking this question I hoped to show that most people realise the potential marketing using SNS’s can be. 13 candidates out of 20 said they would use SNS’ as their main promotional tool, should they start up a business, which shows the marketing potential is obvious

Question 5

80% of the 20 said they follow a large amount of brands and a company on SNS’s in order to receive promotional offers. This shows that also the users of SNS’s are starting to use them not just to socially interact.

Question 6

With Facebook taking up 60% and Twitter the remaining 40%, it obviously shows that users of SNS’s primarily use these two sites in order to keep updated with their favourite companies and brands.

Second Design Wireframes

Team Page Design & Implementation

This is the design I am going to use for the team page. The pitch image is a seperate div and was generated using this tile to save load time:

I wanted to use a jquery script to somehow replace the images with the bio of the team members with some sort of animation.

Before I actually designed the pitch, I intended on using a script that allowed me to expand a div like so:

After click, from this…

To this…

The orange squares represent how much the div has expanded. I tried implementing this script, but it looked extremely basic, and I needed to be able to use images.

I instead used a script that allowed me to implement my images and add some sliding animation to them.

The script I used allowed me to make the image slide out of view, revealing the bio behind it. This works a lot better for me as it doesn’t mean extra space is needed on the page to incorporate an expanding div. The slide option is much more efficient for a page that has minimal space.

Team Page Design Ideas

I aim to write up mini bio’s for members of the Sports Interactive team. Although they enjoy huge success with their Football Manager game, they are still a small collective of game developers based in London, and as it was stated in the brief that the company must be celebrated, I thought it was fitting to give SI’s emloyees personal recognition.

To keep within the football theme, I have decided to use a football pitch with SI’s  developers on the pitch in formation much like the team details preview that is displayed before the kick off of a real live match. For example:

This is what I want to replicate. I instead of using shirts I aim to use just square images which would have a profile shot of each SI member. 

What I aim to do once the design is finished is to implement a script that will allow me to slide the image of the employee down, for it to be replaced with their biography.

Countdown Timer Script & Design

As an important requirement that was stated in the brief was that a strong emphesis should be placed on Football Manager (SI’s main game).

As Football Manager is released annually, I decided to implement a countdown script into the Football Manager page to notify the fans how long left until the next release.

I started by viewing different styles of countdown clocks to draw inspiration for my own design.

I took interest in this example. I didn’t want to use the actual design of this countdown timer as it is very basic, but I feel the layout of it will work well with my own design.

I also took a look at the way HTC designs their clocks that they use on their phones and handheld devices.

I initially wanted to use HTC’s idea of the flip effect ones the time changes. I did try to implement this, but struggled with the code and the animation never looked right. So I chose to simplify it. I did this by using a similar design to the backdrop of the HTC clock pictured above, along with the layout used in the first image.

This is what I came up with. By adding additional effect to the top half of the image where the numbers will go, I aim to make it stand out as I am going to implement it right at the top of FM page so it is the first thing users of the site see.

I needed to create an additional backdrop for it to let people know it is counting down the days until the next Football Manager release.

I decided to base this design on the FM 2012 cover design as it is in keeping with the theme and also is instantly recognizable by fans of the game.

This is how it looks once implemented into the page. I am happy with it as I feel it looks official and it serves it’s purpose, which is to inform fans of the game how long left until the next release. I added an opacity to the image and exported it as png which allows the background texture to seep through, which I feel merges the image better into the site.

The script I used had to be alterd a lot for it to fit into my page.

This is what it initially looked like.I had to change the ‘var defaults’ in the jquery script to display the time how I wanted it. 

Community Page Design Inspiration and Process

As Sports Interactive have a very prominent online presence, it was obvious a page in the website should be dedicated to all the social media outlets SI uses to connect and interact with their fans.

As one thing stated in the brief was to place a strong emphasis on Football Manager (SI’s main game) I want to keep the football themed design running through out the whole site.

This has led me to think of ways to implement my content with the theme still incorporated into it.

One idea I had was to display all social media websites SI uses into a football team tactics board. After some inspiration searching I found this image which I have used as inspiration for my own design:

My idea was to use social media icons to represent a football player’s playing position on the board to keep the football theme and to also send the message to fans that these social media outlets are very much part of the way SI keeps their fans updated on all their new game releases and any other news.

I started by changing social media icons to look as though they have been drawn with chalk and change the colour of them so that they sit right when implemented on top of the chalk board.

I did this by adding filters and changing the hue & saturation of the images:

I encountered some problems when changing the YouTube icon due to the low quality and colour of the image. I drew it out myself and deliberately done it rough as to give the effect that it has been drawn on the chalk board.

I found a royalty free stock image of a chalk board:

I then created an image of the outline of a football pitch, and added ‘noise’ to it to make it look as though it had been drawn using chalk. I then used vector graphic arrow brushes to show the ‘tactics’ on the board.

I then decided to incorporated the approved fan sites and forums list in the style of a football ‘team sheet’, much like this:

I created an image of lined paper and used a font named ‘permanent marker’ which made the text look as though it had been hand written.

This is the final design.