Interactive Media Work main site (dashboard)/web author blog. Smile and interact?

Leave a comment

Research on other websites

Always learn from the competition just make sure you take inspiration rather than shamelessly clone them. You don’t want to get sued- Quote by me.

In all seriousness, researching competition is really important in terms of inspiration and giving you an idea on what works and what doesn’t. So I surfed around the net for some websites that could inspire me.


The NHS website is probably the biggest medical website in the UK. It’s an information website that stores health/ medical information, advice, news, careers in the nhs and more. In short is a huge database for health solutions in the UK.

Visuals and presentation: Clearly there’s an emphasis on a clean look for easy access rather than looking artistic and pretty, the NHS website’s appearance is simple but not any less professional looking. Whilst there’s only a grey background and the colour palette doesn’t go beyond the colours of the NHS logo, the site still looks up to date and aesthetically sound. The shadowing on the bars and panels makes the site look less flat; the huge slideshow advertises information in a sleek way too. Simplicity is the right style for a site like this, however it’s still important to look pretty and professional. Sites with flat colours, unpadded text and general untidy layout gives an untrustworthy impression to users.

Interaction: Hovering on the navigation bar immediately brings up a drop list of other links and categories. This is particularly convenient feature for the user. Also interesting to note is the bold ‘All A-Z topics’ option at the bottom of the list, it allows the whole to be shrunken down for easier viewing. The sub-menus can be moved around, so users can customise the site to their own tastes. What I find interesting is the enormity of the search box located in the corner of the page, it further shows that NHS is a no nonsense site for those looking for information about health.


ATCM is the largest organisation that practises TCM (traditional chinese medicine) and they have many branches in the UK. Their website is a small information hub on Chinese Medicine and there’s also a login for members of the ATCM (my dad included). Unfortunately (or perharps fortunately since they’re a rival) the site for such a juggernaut in Britain’s TCM industry is relatively bad. No actually is rubbish. So much in fact that I was rendered speechless.

Visuals and presentation: The background and colour scheme makes no sense what so ever, it doesn’t match the logo (which itself is filled with white spaces in the wrong places) and neither does it look eye-pleasing. It is almost as if the web author just put the background as his/her favourite colour. Though that’s not the worst of it, the links and navigation element are tiny, hard to distinguish and resembles more of the text that companies don’t want you to read at the bottom of the page than navigation links. If you dare to scroll down the page you’ll be greeted with a banner made in Microsoft PowerPoint 2003 edition. Layout is just as appalling: the text margin on both sides doesn’t even match, one’s wider than the other, though you probably wouldn’t bother reading the text anyway. And why is there a picture of a flower in the top right corner?

Interaction: The links are actually click-able but when you go deeper into the site you’ll discover that some text that are decorated with the underline (what you’d associate with links) does absolutely nothing. They shouldn’t do anything because they’re subheadings, but they shouldn’t have an underline and change of colour upon hovering either that’s what links should do.


BUPA is the private equivalent of NHS and it’s the largest private healthcare organisation at that. Therefore it also provides information on healthcare albeit there’s more of an emphasis on payments and insurances as well as what BUPA offers. In that sense it’s closes to the site I want to produce since it’s both marketing based and information based.

Visuals and presentation: The colour scheme takes its palette from the logo: hovering over links will even turn them from blue to green. Navigation buttons are big and professional (subtle shadowing really helps) whilst remaining simple. The contact us box stands out thanks to being the only green box on the page (this still adheres to the overall colour scheme though). Photos of people are relevant to the content and the slide is another neat touch. Much like the NHS site the overall look is very clean and pure. To top it off layout is always consistent through out the site, while all pictures in the boxes are the same size.

Interaction: The members button and login button are located in an easy to see place. When hovered over, links change appearence seamlessly making it  identifiable. Navigation panels’ appearances stay selected so you know which sections you’re on at all times. Every link works and there’s a lot of interaction available to users on the site.


Leave a comment

Task 2- Design Brief

Description of Client:

Dr Xiaotie Huang, male, owner of a chinese medicine shop, in his 50s.

Contact Details:
Phone number: 07780774347 Email:

Reason for website requirement:

Wants a site to advertise his shop and display other information about chinese medicine.

Desired brand identity:

Formal, wise, professional and clear identity/personality must be conveyed. Almost like conveying the website as a doctor.

Mainly working class, Mid aged men and women (aged 30-50 years ), people interested in or in need of alternate treatments and Chinese medicine. Resident near the shop (Croydon). People with an interest for Chinese culture (using Chinese imagery such as calligraphy). The audience are not experienced with technology and websites so navigation will need to be clear and simple.

Purpose and aims for website:
To gauge awareness for the shop and inform people about Chinese Medicine. To build relationship with the costumers and promote the clinic and TCM in general.

What the users want:

  • Information on the shop, what it does, sell and knowledge  on Chinese Medicine.
  • An online interactive guide about what type of Chinese Medicine cures what and the potential of it.
  • An accesible website- the target audience did not grow up with techonolgy so the website wold have to be easy to use so that even the most technology illiterate can use it (for one my parents/client needs to be able to use it).

Measuring success:

Adding a widget to the site that counts the number of visitors or use an external software (i.e Google analytics).

Easy to use interface, users should be able to access information they want efficiently and quickly.

Devices necessary for access:
Compters (laptops and desktops), tablets and smartphones. Target audience is most likely going to be using computers, (not very tech savvy) since the subject matter is ancient and traditional rather than futuristic. However I mustn’t rule out those that own smartphones and tablets as they’re are enormously popular amongst

Cost to develop and maintain:

Client is allowing me to handle maintaining and developing the website.


It’s more important to ensure that the website’s usability is number one priority, clear aesthetics are important but should compliment the user’s convenience when using the website. The website has to also convey Chinese culture so Eastern deco should be incorporated in moderate amount. Green and red colour scheme to match the colour of the shop.


  • Brief introduction to Chinese medicine. Shop address and contact details.
  • List of illnesses (with pictures) treated and what method are they treated with.
  • Popular products available. Map to shop. Why choose Chinese Medicine page.
  • Pictures of store.
  • Introduction on acupuncture, massages and herbal medicine.


Gantt chart for web design schedule:

Screenshot of Gnatt chart.

Leave a comment

Task 1.4: Building websites practise

There are plenty of online tutorials (W3Schools is especial concise and useful) but I’m the kind that prefers a good book in my hands when learning things so instead I used (mainly) a brilliant book to practise building my first website. Here I screenshot my efforts.

Me coding my first webpage in Dreamweaver. I’m discovering new things every second.

Messing around with basic Javascript.

My first webpage/home page. Pictures link at the top (in the navigations bar) is grey because my mouse (invisible when you take a screenshot) is hovering over it.

The rest of the page of my first webpage. I added a top of page button that actually works! Clicking on the WordPress or Blogger also takes you to either one of my blogs. Gone a bit link mad here.

Upon clicking on one of the pictures links it takes you to this page.

Click on one the, yep you guessed it, videos links and it takes you to this page.


The HTML code I typed to create this simple website (home page):

Before this would have all looked too intimidating and nonsensical to me but now thankfully it doesn’t.


Now time to show the CSS code I typed to style my site:

It’s shorter than the HTML document but it does tremendous things.