Red5 is an Open Source Flash Server that streams audio, video and data to and from the flash plugin live and on demand. Codegent is a full service web development new media agency, based in clapham, london, uk, that specialise in flash design and development work and helped pioneer the open source red5 flash server.

close x You have filtered by tag: design

Stamping our mark

Posted by Mark McDermott on 29 July 2010 at 12:49 PM
Categories: Codegent News
Mark McDermott
Mark McDermott
Co-Founder
BLOG: Stamping our mark

When full service digital is mentioned do you also think… branding?

I think it might come as a surprise to many of our clients that we frequently get involved in branding identity as well. We have worked with a number of start-up web companies over the years so it often makes sense to evolve the brand identity alongside the digital offering as they are so intertwined. However we are also often asked to also refresh existing identities when we are looking at the strategic direction and positioning of clients, particularly if they see their own future being lead through the web. Here are a few examples.

Pownum

Pownum

Pownum is a start-up company. They came to us with a name, but little else. The idea they wanted to get across is that there is power in numbers and if enough people share a similar view and air it one place, then they can affect change.

The idea, therefore, was to create something that felt inclusive, a bit fun, but also had that sense that pulling together we can all make a change.

We presented an idea that had a nod to the imagery of revolution and looked a little bit ‘home made’ making it feel like it was something ‘made by the people, for the people’.

Global Poetry System

Global Poetry System

The Global Poetry System (or GPS) was a project launched by the Southbank Centre and was the brainchild of their artist in residence, Lemn Sissay.

We needed to create an identity for the project that was sympathetic to the Southbank Centre’s brand, but also was positioned as being separate to that. The project relied heavily on user-generated content and so we wanted to create a logo that looked like it could have been made by one of the contributors (ie it looked hand-drawn), with a strong strapline underneath that explained what the system actually did.

Users are invited to upload examples of poetry that they have seen or heard. Much of the content is photos of poetry that has been painted on walls (some might say graffiti), and so we wanted to suggest a hint of graffiti in the application of the identity, too.

Tepilo

Tepilo

Tepilo is a joint venture with Channel 4’s Sarah Beeny. It was important to create an identity that could be used alongside Sarah’s image, but that wasn’t irrevocably linked to her, in case the business was sold to someone else in the future.

The identity needed to look authoritative (we are, after all, talking about most people’s largest asset), but friendly and approachable. We felt that these brand attributes also reflected those of Sarah Beeny.

The main visual element of the site is the multitude of user-generated images. We had to ensure that anything we created wasn’t battling for attention with the users’ own images, about which we had no control. We therefore created a logotype using blacks and greys and used muted blues as a background.

We created a strapline “Sarah Beeny’s smarter way to buy, sell and let your home”, but we kept this apart from the actual logotype.

Poetry Book Society & Poetry Bookshop Online

Poetry Book Society
Poetry Books Online

The Poetry Bookshop is owned by the Poetry Book Society. We were commissioned to redevelop their site bit also to evolve their identity.

For both identities, the audience group were loyal and many had been with them for years. We needed to make sure that we didn’t totally reinvent the identity and alienate the organisation’s loyal user-base.

Instead, we evolved the typefaces and colours, to give it a more up-to-date feel, but one that was instantly recognizable to anyone who had seen the earlier incarnations of their logos.

If you are interested in talking to us about branding please drop us an email on hello@codegent.com or call us on 020 7720 4040.

close x
Share this story
Share with third party communities
This will take you to a new window.
close x
Email this story

The Wonderful World of After Effects

Posted by Karine Tonson la Tour on 19 May 2010 at 02:57 PM
Categories: Codegent News, Musings
Karine Tonson la Tour
Karine Tonson la Tour
Designer
BLOG: The Wonderful World of After Effects

There are 2 things that you want to avoid when a user lands on your site; firstly scaring them off with too much copy, secondly not giving them enough information to enable them to use your website or even understand what you do. 

A video is a great compromise; it can explain your proposition in seconds whilst simultaneously increasing accessibility and engagement. Creating, producing and editing a professional quality video seems like a daunting task but in reality, with the right tools, it isn’t as hard as you might think.

We’re going to give you an overview of why video is a valuable asset for any site, and why we believe After Effects is the best product for the job.

The Importance of Video

Why a video? From information-lead films to arty stop motions, video allows direct, fluent and human communication. It could be shown on the landing page of your website and allow you to present your business in an instant. It can also be used to reach out from your site to create buzz around your marketing campaigns. 

Why After Effects?

Improving your video 
There are a myriad of tools that After Effects gives us. It allows us to remove all evidence of camera shakes, increase contrast, modify luminosity to bring out gorgeous colours and so much more. Visual and matting effects can also be applied to improve the look and feel you want to give to the video. Alternative video editing programmes, Premiere or Final Cut can handle most of these improvements just as well but what makes After Effects better is that it doesn’t stop there...

Tracking function, total symbiosis
We can create a multi-layer composition by integrating other videos, photos, texts or vector graphics into your video. Notice I said "integrating", beware, adding is one thing, integrating is another. Thanks to the tracking function, we can follow a point moving on the 'master' video and apply this movement to the new item we have layed on top. From this comes the impression of symbiosis, graphics follow the movement of the camera perfectly, they really feel part of the video.

The Third Dimension
After Effects now takes your video production to the third dimension. The 3D mode allow you to create a virtual camera over your composition, to allow you to change your point of view. You have complete control over this virtual camera, being able to configure the lens length, image area size, and aperture. This powerful tool makes it quick and easy to incorporate several lights with shadows and define their intensity, all of which will take your video new level of dynamism.

High Quality Manipulation 
With After Effects, time can be stretched and/or reversed. But crucially it will also smooth out the jerkiness usually associated with this sort of effect when it is applied with Final Cut or Premier. 

After Effects is integrated
After Effects works seamlessly with other Creative Suite software such as Illustrator, Photoshop (including it’s 3D layers), Flash, Premiere Pro and other QuickTime-based software. You can even import and manipulate audio files and render them in high quality in real time. It is even possible to export the composition from After Effects to Flash, to then make it interactive. Whatever the project needs, this level of integration gives you the flexibility to port your content across different software.

Fit the Web

Be versatile & be connected
After Effects contains an export module which will optimise your video for the web. With a couple of clicks you can export your film to web-friendly formats like QuickTime, AVI or MPEG-4, making it easy to put your video onto your website, blog, Youtube, Vimeo etc.

Mobile accessibility 
The latest version of After Effects integrates mobile-device authoring into its workflow and multi-device previews for most phones and PDAs. With the ever-increasing popularity of smart phones, thinking about how to reach people on their mobiles is becoming a close second to reaching people on their PC's.

Video is a fantastic and popular way to reach and engage with people and any tools that help us do that better get the Codegent seal of approval!

close x
Share this story
Share with third party communities
This will take you to a new window.
close x
Email this story

Is Lorem Ipsum killing your design ?

Posted by Matt Jukes on 26 March 2010 at 05:10 PM
Categories: Musings, Codegent College
Matt Jukes
Matt Jukes
Creative Director
BLOG: Is Lorem Ipsum killing your design ?

It’s not unusual that in a digital agency the producer will say to the designer “ just put in some Latin, and we’ll put the copy into the CMS later”. This got me wondering; by doing this are we relegating a very important part of our messaging to an afterthought in the creative process. Is Lorem Ipsum killing design?

We have all heard a thousand times, that “content is king”, but do we really believe it? Websites are information services  and as much as this may offend many designers, the User isn’t coming to the website you are designing to Marvel at your use of colour, or be impressed with your choice of typography; they are there to find the information they want. Don’t get me wrong the design is far from irrelevant, but it's role is to make the user feel comfortable and guide them to the CONTENT they are looking for.

Have a think about how “normal web users” use  websites. The people I am talking about are people like your parents, the type of person who uses the scrollbar to scroll, the person who uses the internet every day, but won’t know what a browser is. These people are more than happy to ignore the design and put up with cumbersome usability, as long as they can find the content they are looking for. Good copy is responsible for helping people find what they are looking for and good copy should be clear, concise, and informative. Throwing some copy in at the end will more than likely be none of these things. If the content is the most important part of any website,  why aren’t copywriters embedded into the beginning of the process of  all digital agencies? They are the ones who can make the real difference to the success of any website.

Have I offended all the designers reading this yet?

You shouldn’t be offended. We should encourage designers to be part information architect , part copywriter and of course part designer. We need designers to think about the user at all stages of the design process  and get them asking the two most  important questions “Where do we want the user to go?” and “ what messaging can we use to get them there”. From a user perspective the advantage in this approach is clear, but there is an added advantage to the designer themselves. By placing considered copy into your design your clients will better understand the messaging, making it easier to get sign-off. The other advantage to the designer is not trying to force the final copy, which is always twice as long as the Lorem Ipsum placeholder, into the keyframes. Everyone's a winner.

So before you hit cmd+c on the Latin,  stop and think about what you should actually be saying.

close x
Share this story
Share with third party communities
This will take you to a new window.
close x
Email this story

The science of design

Posted by Matt Jukes on 3 March 2010 at 12:46 PM
Categories: Codegent College
Matt Jukes
Matt Jukes
Creative Director
BLOG: The science of design

In recent weeks I seem to be getting more and more briefs landing on my desk, requesting "web 2.0" graphics or a "Glassy effect". I find it interesting that this language has seeped into to the mainstream, however, this is a prime example of clients jumping allowing their personal preference to get in the way of their audience's preference. This way of thinking relegates the design process to simply applying a style and colouring in-between the lines and doesn't consider the design as communication.

Design should never be a style or a fashion rolled out and applied to a wireframe. Design is about relevant effective communication with your target market. It is often forgotten that the design is the first experience a user will have with your website. Before the user has read a word, they have already scanned over the page, taken in the visual language and made an instant decision on whether or not this is the right sort of site to be able to find what they are looking for. This is where good design will stand out and help guide the user through the page, without them even knowing. For the best design does not announce itself to its audience but is accepted and engaged with without them even realising.

Here at codegent, once we have identified the audience we want to communicate with and the key message which we want to leave them with we begin intensive research into that audience. We look at competitors and then look at other brands which our target audience engage in. I have written before about the crucial nature of knowing your audience but I can't stress this enough. You need to know everything about your audience, you need to know where they go online, whether they use social media, whether they access their email through a blackberry, the kind of visual language are they used to, what sort of symbols they associate with value. By getting to know your audience, you can learn the best visual language to communicate to them with .

Once we have collected this information we sit down and analyse the visual language. In the simplest terms this is identifying themes in typographic styles, colours used, style of photography and how these graphic elements are brought together. Once this visual language has been deconstructed and the meaning of all of these symbols has been identified, we can use this visual syntax to be able to create the right message for the right audience. This can then be used to guide the audience through the website, getting them to take the path we want them to follow .

This semiotic approach is at the heart of all good design. By taking this approach all design decisions become quantifiable and it removes personal preference. As much as the client's wife may want to make it "glassy", if the researched visual language doesn't support this, then it is the wrong decision to make.

close x
Share this story
Share with third party communities
This will take you to a new window.
close x
Email this story

New Year puts Mindfulness top of our 'to do' list

Posted by Michael Wells on 19 January 2010 at 04:10 PM
Categories: Codegent News, Site Launches
Michael Wells
Michael Wells
Project Manager
BLOG: New year puts Mindfulness at the top of our 'to do' list

There is nothing harder than dragging yourself back into work at the beginning of January knowing that even if you had the energy to type an email – you are unlikely to get a response as everyone else will still be on holiday! So what we really needed was a website launch to get us focused and motivated. And thanks to our clients at the Mental Health Foundation this is exactly what we got when we were asked to design and build the Be Mindful website ready for a 06:15 launch on the GMTV sofa on the 5th January (which translates as focused and motivated x10!!)

Be Mindful is the latest campaign from the Mental Health Foundation and is supported by leading doctors and celebrities such as Ruby Wax. It is part of a national campaign to promote Mindfulness - a range of therapies and techniques that can help people suffering from mental and physical problems.

Our aim for the Be Mindful website was 'simplicity of design' and 'clarity of information'. The audience for this campaign falls into two main categories – the public who are looking for information, advice and courses and GPs looking for information for their patients and surgeries. We wanted users to be guided through the site according to who they are and what is relevant to them – ensuring that they interact with all of the key touch points on the site as they navigate their way through. This thinking is evident in the design, layout and architecture of the site - from the clear calls to action on the homepage to the arrow icons on the tab navigation, guiding the user through their journey.

The About Mindfulness section is broken into two distinct areas ‘Experience’ and ‘Evidence’ again helping to simplify the site and sign-post the user according to the information that is relevant to them. Both sections are supported by video, audio and resources which users can view, download and share. We have also integrated an online payment system enabling GPs to order surgery toolkits and for anyone who would like a full copy of the mindfulness report, they can order one here.

One of the main findings that drove the Be Mindful campaign was that Mindfulness courses are few and far between and often hard to find. The find a course section brings these courses together in one place. The course section uses a Google maps mash-up and allows users to search for courses near them by entering their postcode or searching the map. The site also allows practitioners to promote their courses for free.

Finally there is the show your support section, an online petition to make more mindfulness courses available across the UK.

It is early days but Mindfulness is already generating lots of publicity and support. It’s great to be involved in such a positive campaign but we are already saying goodbye to any plans for a quiet February as we get back into the studio to start planning the next phase. Phase two will include a stress diagnostic tool and allow users to take part in Mindfulness courses online. I have also heard a rumour of a cheeky little iPhone app so that you can do your course on the go (well it’s just expected these days isn’t it!)

Check out the website here.
 

close x
Share this story
Share with third party communities
This will take you to a new window.
close x
Email this story

3 key steps to successful website design

Posted by Matt Jukes on 2 December 2009 at 02:13 PM
Categories: Musings, Codegent College
Matt Jukes
Matt Jukes
Creative Director
BLOG: 3 key steps to successful website design

I often get asked 'what makes a website design great?' So I thought I would put together what I feel are the 3 most important steps.

Step 1: Know your audience
Step 2: Know your audience
Step 3: Know your audience

This may sounds rather repetitive; however every design decision must come back to what your audience wants. So how do you get to know your audience?

  1. Define Your Audience
    I have lost count of the number of times a client has returned a creative brief to us with the audience section filled out with “equal split male & female, Aged 8 – 80”. That’s basically everyone except the family pet.

    Obviously, from a communications point of view this isn’t very useful. You talk to an 8 year old girl, very differently to her 80 year old grandfather. What we do here at codegent is try to break down this age demographic by looking at the reasons they will come to the site; the 8 year old needs help with her homework and her grandfather is part of a lobby group looking for information.
  2. Audience Interviews
    This step is too often forgotten in the design process; however nothing clears out the assumptions of a designer faster than a 5 minute chat with their audience. Ideally this is best done with a large sample size of random members of the target market but, as we all know, budget constraints don’t always make this possible. When this isn’t possible, we always make sure that we chat to at least a couple of people that fall into our target audience. It is an essential sanity check for all of our thinking.
  3. Research
    Once we know who will be coming to the site, we will go out and find out everything we can about them. How much time they spend at a computer, which sites they visit every day, what sort of things are they comfortable doing online. All of these questions (and many more) help us build up a profile of the target audience. It is from this profile that we are able to establish the most effective visual language with which to communicate with them.

Once we have gathered all of this information and come to our conclusions, we present this back to our clients, as this will be the reference point we are going to justify all of our decisions back to when we are working on the art direction & information structure of the work being produced. All of this “design work” has to be done before we can power up photoshop and get stuck into the visual phase.

close x
Share this story
Share with third party communities
This will take you to a new window.
close x
Email this story