Liam Warby :: Multimedia Design Portfolio

I am…

a multimedia designer... a front-end developer... and ridiculously easy to work with...

I have…

agency and freelance experience, plenty more room in my portfolio and my very own computer!

I will…

be precise and to the point, always listen to ideas, readily work with others and indent my bloody code!

I can…

design, write HTML & CSS very well, write jQuery & PHP well enough and learn very quickly...

back to the top

Please send me a message about my work.

If you think it’s rubbish then please be nice about it. If you’ve got a question then fire it my way...

back to the top

My Portfolio

I want to see:

Filter by type
  • Battersea Dogs and Cats Home

    Battersea Dogs and Cats Home thumbnail
    desktop thumbnail mobile thumbnail

    Skills

    • CSS3
    • HTML5
    • JS
    • PHP
    • Remote Debugging
    • Xmind
    • jQuery
    • Bootstrap
    • LESS
    • WAMP
    • Sublime 2

    Providing only design and front-end build, Chameleon worked with a specialised development agency to perform an extensive overhaul of the Battersea Dogs and Cats Home web presence.

    By integrating a responsive interface with a customised CMS, processes and procedures within Battersea's organisation were brought together to bring real-time information to staff and media-rich content to users.

    People

    Credits

    close

  • Learn With Dogs Trust

    Learn With Dogs Trust thumbnail
    Learn With Dogs Trust

    Skills

    • Design
    • Photoshop
    • Illustrator

    A redesign of their educational micro-site, Learn With Dogs Trust was an educational site providing media rich resources for teachers of young children as well as acting as a platform for their educational officers.

    The brief required a site that was visually distinct while showing hints of The Dog Trust's main brand this flexibility in brand guidelines is unusual in the charity sector.

    People

    Credits

    close

  • Breakthrough Breast Cancer

    Breakthrough Breast Cancer thumbnail
    desktop thumbnail mobile thumbnail

    Skills

    • CSS3
    • HTML5
    • JS
    • GIT
    • Drupal
    • Remote Debugging
    • Xmind
    • jQuery
    • Bootstrap
    • LESS
    • WAMP
    • Sublime 2

    Working closely with a dedicated developer Breakthrough Breast Cancer required a Drupal powered website sporting a fresh new brand image.

    Converting designs into static HTML5, these then formed the basis of a responsive theme.

    Styling inflexible HTML proved to be the major obstacle in this project, added to the idiosyncratic design.

    People

    Credits

    close

  • Norwood

    Norwood thumbnail
    desktop thumbnail mobile thumbnail

    Skills

    • HTML5
    • CSS3
    • JS
    • Remote Debugging
    • jQuery
    • Bootstrap
    • LESS
    • Sublime 2
    • WebMatrix

    With responsive design at the core of this project from the outset, Norwood's website was an example of striking design techniques and usability complimenting each other.

    Unrestricted by the need to support IE7 much of the artwork was constructed using CSS alone.

    My role was initially as the front-end developer but later became as support.

    People

    Credits

    close

  • World Horse Welfare

    World Horse Welfare thumbnail
    desktop thumbnail mobile thumbnail

    Skills

    • CSS3
    • HTML5
    • JS
    • Twitter Bootstrap
    • LESS
    • jQuery
    • WebMatrix

    The build of World Horse Welfare straddled my adoption of HTML5, CSS3 and responsive design.

    After the main build was complete, the site was retrofitted with LESS driven CSS and a responsive framework.

    The site was implemented using ASP.NET Razor which built a basic understanding of the MVC framework.

    People

    Credits

    close

  • Big Bus E-Ticketing Service

    Big Bus E-Ticketing Service thumbnail
    desktop thumbnail mobile thumbnail

    Skills

    Front-end support for Big Bus brought some interesting challenges on number of occasions.

    Over the course of the project we facilitated PDF ticketing and mobile QR codes...cross-compatibility across desktop, mobile and nationalities was a major challenge.

    Credits

    close

  • CAFOD

    CAFOD thumbnail
    CAFOD

    Skills

    • CSS3
    • LESS
    • Sublime 2
    • WAMP
    • Xmind
    • eZ Publish

    CAFOD's main site was powered by eZ Publish which posed challenges in itself.

    With an emphasis on accessibility the mark-up followed a different logical order to the visual appearance which added a further level of complexity.

    Over the course of the project adjustments to the styling had resulted in an unmanagable stylesheet and required a overhaul.

    The original CSS was stripped out and replaced with a LESS driven stylesheet which enabled like-structures to react in different ways, context dependent.

    People

    Credits

    close

  • Chameleon

    Chameleon thumbnail
    Chameleon

    Skills

    • HTML4
    • CSS2
    • JS
    • Photoshop
    • jQuery
    • Dreamweaver
    • WebMatrix

    Following a re-brand, the agency for whom I worked at the time produced a new website for themselves.

    My tasks involved converting major designs for each page type and designing smaller elements.

    These were then powered by custom CMS with Chameleon's own codebase.

    Particular features of interest include the interactive 'results cycle' widget built, but not designed by myself.

    People

    Credits

    close

  • On toast

    On toast thumbnail
    On toast

    Skills

    • HTML4
    • CSS2
    • jQuery
    • Dreamweaver
    • Photoshop
    • Illustrator

    'On Toast' was a breakfast-time edition of a seminar which proved popular with commercial sector senior level marketing friends.

    This campaign involved reworking previous artwork while still delivering a unique brand image.

    All of these projects were very simple but used themes that could be carried across a range of media.

    My responsibility was to design and produce the web, print and email artefacts.

    People

    Credits

    close

  • Made to be measured

    Made to be measured thumbnail
    Made to be measured

    Skills

    • HTML4
    • CSS2
    • jQuery
    • Dreamweaver
    • Photoshop
    • Illustrator

    'Made to be Measured' was a free seminar organised by Chameleon for the benefit of clients and leaders in industry.

    The concept was collaborative but my responsibility was for the design and build of the marketing material.

    These small projects all involved synchronising media artefacts to strengthen the brand; the continuously expanding tape measure which stretched out across the top of the horizontally-scrolling landing page corresponded with the 1.5m x 2cm 'tape measure' mail-outs.

    People

    Credits

    close

  • VSO - In Her Shoes

    VSO - In Her Shoes thumbnail
    VSO - In Her Shoes

    Skills

    • HTML4
    • CSS2
    • JS
    • jQuery
    • Dreamweaver
    • Photoshop

    A simple micro-site for the promotion of a VSO fundraising drive.

    This conversion [of a design provided by the client] required some rudimentary interactivity in the form of an interactive map.

    The challenges lay in working with a distinctly 'for-print' appearance and achieving IE7 support.

    People

    Credits

    close

  • Share

    Share thumbnail
    Share

    Skills

    • HTML4
    • CSS2
    • Dreamweaver
    • Photoshop

    On Share I was mainly in a support role and much of my involvement was in bug fixing and creating new features.

    Due to the nature of charities' audiences, every site has to be progressively enhanced and accessible which gives rise to the problem of achieving interactivity with CSS and images alone.

    The map on the home page is a good example of this and with CSS3 transitions it could even be animated...but not in IE!

    People

    • Alex Odhomi

    Credits

    close

  • Rules of engagement

    Rules of engagement thumbnail
    Rules of engagement

    Skills

    • HTML4
    • CSS2
    • jQuery
    • Dreamweaver
    • Photoshop
    • Illustrator

    'Rules of Engagement' was a free seminar on how to create an effective online engagement strategy using website intelligence, search and social media.

    As with many of these small projects, the brand was key and involved a central piece of artwork in various forms and across various media.

    My responsibility was to design and produce the web, print and email artefacts.

    People

    Credits

    close

  • Digital Marketing Clinic

    Digital Marketing Clinic thumbnail
    Digital Marketing Clinic

    Skills

    • HTML4
    • CSS2
    • jQuery
    • Dreamweaver
    • Photoshop
    • Illustrator

    'Digital Marketing Clinic' was a series of talks for senior level managers in the non-profit and higher education sectors.

    This short campaign involved creating the printed 'first aid tent' mail-outs and artwork for the landing page.

    Later, these small projects allowed for greater creative and technical freedom but all maintained a strong central theme.

    People

    Credits

    close