July 13, 2016

Marketo Form CSS – How To Remove and Override It

The Marketo Form CSS Problem As many marketing automation engineers will atest to, whilst Marketo is a great tool for streamlining the nurture, acqusition and remarketing cycles, there are some areas especially from a design perspective that leave a little to be desired. The mainstay of any landing page to capture potential lead information, be that linear or via , is a form for data capture. That's great if you're happy with the standard elements and CSS provided by Marketo, you may even have Read more [...]
July 9, 2016

Golden Oldies | HMV “my inspiration” Posters

HMV "my inspiration" posters Almost nine years ago, I worked on a flash based project with an agency in Manchester to produce a wall based interactive journey which showcased artists and their inspirational quotes. Interacting with the wall gave a full screen version of the poster and latest albums and tracks. It was good project to work on as it wasn't run of the mill and was present on the main HMV website until 2013, so stood the test of time well. I just thought I'd pop theses wonderful pieces Read more [...]
July 8, 2016

SCSS Mixin for Text Shadows

Another simple SCSS mixin for setting text shadows on an element, includes parameters for:

  • X Offset
  • Y Offset
  • Blur
  • RGBA Color
@mixin text-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4)) {
    text-shadow: $x $y $blur $color;
}

Usage

.h1{
@include text-shadow(2, 2, 5, rgba(0,0,0,.4))
}
July 7, 2016

Wooden Business Cards – The Arrival

Well, the wooden business cards actually arrived today, and I wasn't too sure what to expect based on the digital proofs, but they are actually better than I could have wished for! The guys over at Plasma Design (plasmadesign.co.uk), have done a truly awesome job, from the customer service, to the packaging and the final product. Packaging The packaging was neat, protected, and made sure the finished product was going to be in tip-top shape when it arrived. The person who was responsible Read more [...]
July 6, 2016

New Branding, New Business Cards

After quite a few years of intense silence from Phireworx, I've decided to give it a reboot starting with the branding. The rest of the old versions of the site, will be available shortly, inlcuding the following, but not limited to (potentially avaialable with source code): Adobe Fireworks Extensions & Commands Adobe Flash Extensions & Commands Adobe Dreamweaver Extensions & Commands Flash Anthology (PDF), free downloadable of my Flash book from SitePoint But back to Read more [...]
June 5, 2016

SCSS Mixin for Preloading Images with Cross Browser Opacity

Preloading Images with Cross Browser Opacity A simple SCSS mixin here for setting the opacity on preload to 0, and when the image is loaded to a value of your choice (in this example its 90%, use 1 as your value for 100%) @mixin opacity($opacity) { opacity: $opacity; $opacity-ie: $opacity * 100; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity="+$opacity-ie+")"; filter: alpha(opacity=$opacity-ie); } Usage img.preload{     @include Opacity(0);     &.complete{         Read more [...]
June 4, 2016

SCSS Mixin for Background Cover

SCSS Mixin for Background Cover Read more [...]
April 4, 2016

Responsive Landing Page with Marketo Integration

As a very varied part of my day job as a technical marketing consultant, there are many varied tasks that are required of me, to maximise conversions for landing page sign-ups and lead acquisition. To this end we decided to take the baseline landing page for free trial reigstrations and give it a facelift and introduce some interesting conversion increasing features. Here's the original landing page, a straightforward light landing page, with the minimum amount of form fields that were originally Read more [...]
May 24, 2015

Golden Oldies: Design Tips That Stand The Test Of Time – Almost

Many sites today, in addition to a liberal sprinkling of graphics in the banner and in the body, have graphic navigation systems. Navigation systems have become more elaborate, as sites have evolved from 6-page brochure-like entities to full-fledged multimedia sites with multiple web applications. Coinciding with the shift in online content is a shift in the metaphor used for designing web graphics. Less and less do we see ourselves designing “pages”; instead, we now find ourselves designing Read more [...]
May 24, 2015

Golden Oldies: Page Speed Tips from 2001

Both Fireworks MX and Dreamweaver MX share many similar interface elements and editing procedures. In addition, the integration between the graphics creation program and the HTML authoring program are so tight that it is easy to produce a seamless collaborative workflow for graphics creation, optimization, and delivery into your web pages. When designing images and graphical components for your site, bear in mind that every single image, from an advertisement to a spacer increases the length of Read more [...]