What I Do

Amazing things

Email Development

Hand coded Emails in HTML and CSS, tested across the major Email Service Providers, designed to make it easy for user to engage with your company. Emails are mobile optimised and coded to the latest email standards.
Occasionally I do designs!

Custom HTML websites

Appealing custom HTML websites, Landing Pages, Web Banners, Cross Browsing and Responsive Design, Wordpress, Joomla and Prestashop CMS.

Creativity

Helping to producing visually engaging, innovative and functional mobile and web visuals. Photoshop manipulation skills, eye for detail and original ideas you will be designing stunning on-brand concepts for campaigns and promotions

About me

Everything started with a passion for web technology, in particular HTML, CSS and Flash.

When I first started I did not know much about content management systems and would rely solely on my skills in HTML & CSS. I would hard code every aspect of the website and this gave confidence and flexibility in meeting my client’s needs. Having also a diploma in Art helped refine my touch as a designer adding to my skills the ability to develop web designs from scratch accompanied to creative design.
I consider myself versatile, reliable and professional. I always try to exceed client’s expectations ensuring excellent results in both development and design.

I believe that a developer must also be a designer in order to have a holistic view of the work from the technological point of view but also from the visual one.

  • RAPP UK

    Email Developer

    I was responsible for creating HTML email modules using Salesforce Marketing Cloud for Ralph Lauren, working closely with a SFMC Technical we created 66 modules with Drag&Drop functionality split in 2 business units, testing the emails across ESP using Litmus, troubleshooting and QA testing.
    The modules included AMPscript in order to take the country, language, modules, exclusions, segmentations, copy, images and links dynamically from a CSV file having only one template. Together with SFMC Technical and Service Delivery Director have created an Excel project tabs called "Matrix", this project tabs is formed of 4 tabs that contains all the information about the campaign, from country to segmentations and more.

    The goal of Matrix is to create 30 emails in no time and facilitate the client with email marketing campaigns.

    I also contributed into creating Montblanc's HTML responsive email modules and creation of GIFs. I coded new interactive modules in order to increase open rates. The modules are actively used by Montblanc.

    Occasionally I created evites for Burberry using a platform called Adzu property of Code worldwide (my department in RAPP).

    I played a role as consultant for other RAPP's clients, I was suggesting what approach to use for particular client's request or if a particular effect or functionality was possible to be used in HTML emails and in case provide the code.

  • OTM Create

    Email Developer

    Responsibile for coding responsive and non responsive Global Email Marketing for HSBC Bank and Citigold Bank. Testing email across Email Service Providers using Litmus and fixing existing emails. I worked closely with designers and Account Managers

  • Display Block

    Email Developer and Designer

    I have hand coded larger scale projects for clients such as SpaceNk, Timberland, Dogs Trust, Richer Sounds, Gorgeous Apartments, Starlight Childerns, Purple Parking, Meteor, Medihow and Display Block.

    I was responsible of development and testing of hand coded HTML emails across all the major Email Service Providers (Hotmail, Yahoo-mail, Gmail) using Email On Acid. Creating HTML5 snippets. Fixing problems encountered in the functioning of the emails and functionality and appearance of an email, testing emails in different email providers & at diffrerent resolutions.

    Co-ordinate with Central Marketing and relevant territories to ensure all localised copy and assets are received on time for each email campaign.

    My main project was Timberland, I was responsible for hand coding Global Email Marketing, bespoke emails across Uk, Italy, France, Spain, Germany and Neatherlands, extended to 16 countries for specific campaigns like Christmas sales, Black Friday and local festivity.
    To increase the production I coded custom HTML snippets for Timberland reducing the time of building, also creation of interactive emails with the 2018 trends like videos, animations or slides. For Timberland I have designed banners for third party agencies, testing emails across Email Service Providers using Email on Acid, testing emails on Desktop and Mobile, animated GIFs, Email Designs and Wireframes using Photoshop and Illustrator.

    For SpaceNk UK & USA the assets were provided by in-house designers my job was to hand codeing HTML emails, generating tracking links, tested the emails across Email Providers using Email on Acid, Desktop and Mobile

  • IM London

    Digital Designer

    Responsibile for working on a project called Marvolio’s Nostrum. For this project I contribute to hand coding the website in HTML5 and CSS3 and usign Boostrap for Responsive Design and Jquery animations, lightbox and HTML image maps as buttons.

  • Eazi Apps

    Freelance Graphic Designer / Digital Marketeer

    Assist in developing company branded native Android and iOS compatible mobile apps using the EA Content Management System. Ensure visual images and multimedia files provided for the app are of a high standard and meets the Client and EA’s requirements. Support digital marketing activities, where required

  • Voolcano Harmonix Records

    Freelance Web Designer

    Responsible for working on the project, designing newsletters and interacting on a weekly basis with marketing manager, sound engineer. Updating the website and music networks with new music release, designing graphics for Facebook and short videos for promoting the artists.

  • Dario Daniele Design

    Freelance

    I have worked as a freelance creative. During this time I have restyled some exsisting websites, previously created

  • Smartweb S.r.l

    Junior Front End/ Web Designer

    Responsible for working on a wide range of projects, designing appealing websites and interacting on a daily basis with graphic designers, back-end developers and marketers. I contributed into improving MobOffice CMS (property of the company) re-styling the HTML of the system, creating new HTML5 and CSS5 modules such as reservations forms, calendars and helped the CMS to compete with other agencies. The improvements carried out benefited the company, customers and users. I introduced Responsive Design and in regards to social networks I also introduced software like Hootsuite
    Duties:

  • KingoLab

    Freelance Web Designer

    Kingolab is a small web boutique based in Pozzuoli, Naples. I worked as a freelance web/graphic designer. I was coding HTML websites mixed with Flash ActionScript2 animations

  • Dario Daniele Design

    Freelance Web Designer

    I started as a HTML developer, hand coding websites from scratch, creation of Flash animations or websites, coding of custom HTML features like photogallery, videogallery, slides show for small businesses my hometown, Naples.

Why choose Responsive?

Responsive email design has been growing steadily in popularity, and it’s no surprise as to why: 47% of email opens are on a mobile device, and some brands see upwards of 70% of their emails opened on mobile. These brands turn to responsive design techniques to create better experiences for their subscribers, and in many cases, increase their click and engagement rates.

WHAT IS POSSIBLE WITH RESPONSIVE DESIGN?

The possibilities are endless, but some common uses of responsive design techniques include:

Changing hierarchy

Changing navigation

Enlarging fonts

Changing colors

Changing layout

Scaling images

Adding padding

Changing or hiding content

50

percentage of email opens happen on mobile devices

80

percentage of people delete an email if it doesn’t look good on their mobile device

150

Times/day people look at their phones

A responsive email template is a template for email marketing designed to look great and function properly across any device. A responsive template will automatically adapt to any screen size, so whether the email is opened on a smartphone, tablet, or a computer, it will look great, function well, and be easy for the recipient to read.

Why is this such an important consideration for anyone conducting email marketing? Well, you know what really grinds my gears? When I open an email marketing campaign on my smartphone and have to pinch and expand to see the text.

It tells me that the sender didn’t take care in testing the email before it landed in my inbox, and that means they don’t care about my time or the quality of our interaction.

As a result, I don’t particularly care to do business with them.

In fact, 75 percent of subscribers admit they will delete an email if they can’t read it on a mobile device. In this day and age a lot of people rely on their smartphones to check email. And since emails are one of the top ways a lot of brands interact with their clients and followers, it’s important to keep this in mind and adopt responsive email design so that your message gets across clearly regardless of device type and screen size.

WHY YOU NEED A MOBILE-RESPONSIVE EMAIL TEMPLATE

So, what is a responsive email template? In summary, a mobile-responsive email templates automatically adapt to the size of the screen they’re being displayed on so your email looks great, has a functional layout, and is easy to read regardless of your subscriber’s screen size.

And with over half of all email now opened on a mobile device, looking good on mobile is essential to delivering a quality message to your customers and subscribers.

Conclusion

Designing and developing a professional-looking responsive email takes some planning. Follow the ten commandments and it’s easy to pre-empt potential problems along the way. That leaves more time to concentrate on the really important things like captivating copy and dazzling design.

So we’re not going to panic when James buys a tablet, Sarah finally upgrades her handset and Bob’s company jumps ship to Mac. We’ve thought ahead and can relax in the knowledge that our emails look great on any gadget.

Interactive Email’s Opportunities and Challenges

Enthusiasm for email interactivity is at an all-time high. Marketers told Litmus that creating interactive email experiences was going to be the biggest design trend of 2018, and that’s a year after marketers declared that 2017 is the year of interactive email. Marketers are right to be excited.

Allowing subscribers to click in an email and activate additional content within that email reduces friction by not forcing them to visit a website or app. However, email’s disruptive evolution from static message to mailable microsite presents many challenges.

But first things first. Before we look at the challenges, let’s look at all the opportunities that interactive emails offer to marketers.

For more Interactive and Advanced Email Design Techniques click Here

INTERACTIVE EMAIL OPPORTUNITIES

Email interactivity allows brands to add a wide variety of elements to their messages—everything from image galleries and offer reveals to hamburger menus and add-to-cart functionality.

A majority of brands that have used interactivity have used it to add carousels and hamburger menus to their emails. On the other hand, review and rating submissions, add-to-cart functionality, and search bar entries have been used by relatively few brands.

Here are some more details and examples for some of those interactive email elements…

CAROUSEL OR IMAGE GALLERY

Interactive email is becoming more popular than ever. Using a carousel in an email can be a powerful tool, especially for mobile where vertical space is at a premium.

HAMBURGER MENU

A familiar element in mobile apps, hamburger menus save valuable screen real estate, while still keeping navigation links handy. This has become the most pervasive interactive email element as it has been incorporated into mobile email designs across a number of large brands, including REI, Chili’s, Aeropostale, and Neiman Marcus.

Full Page Intro Animations in Email

This is a simple technique to show a brief animation of an object or text against a blank page and having the rest of the email “fade in” after the animation ends.

Games in email

Sonic the Hedgehog Game in Email

One of the exciting possibilities of interactive email is games. Kristian Robinson of Two built two really cool versions of Sonic the Hedgehog games that you can play within an email. I was blown away with the slick execution of both these games as playing them had an authentic albeit brief experience.

Side Runner

In this version, the goal of the game is to jump and avoid the spikes at exactly the right moment. This technique uses two sets of CSS animations. The main (default) animation sequence has Sonic running into the spikes at the end. The alternate sequence takes over when the user taps on a “jump” button at the right time and has Sonic jumping safely over the spikes.

See the example.

First Person Runner

Not content with his earlier achievement, Kristian built a version of Sonic with a “first person” view. The goal of this game is to collect a bunch of rings before the time runs out.

The implementation used radio inputs to keep score and the build-out of a very elaborate path consisting of background image sprite animations.

see the example.

The Dawn of Kinetic Email

Although HTML email has been around for almost as long as the Web, email has often been regarded as the Web’s ugly stepchild. The inconsistent and outdated HTML support in email clients seem to reflect a mindset that as long as senders can place some images and text in an email, it’s enough. Why ask for more? Apparently, email is not a medium for innovation.

Recently, that perception began to change as designers began finding ways to implement interactive and dynamic content within email. These techniques not only captured recipients’ attention, they offered new and exciting creative avenues for email designers.

B&Q, a major UK retailer, attracted a lot of attention last year when the company sent a series of emails that featured fully interactive components using just HTML and CSS.

In a press release, Oracle, the developer of the campaigns coined the term “kinetic email” to refer to the techniques used. I personally like the term — “kinetic email” is catchy and appropriate.

However, what exactly is kinetic email? And while we’re talking about it, what isn’t kinetic? I’d like to offer my perspective on what kinetic email is and open a discussion to move email innovation forward.

Interactive Hotspots in Email

As you can see from the example above, interactive hotspots, or user initiated information overlays are an effective way to deliver additional contextual information on an image.

See a Live Demo

Beginnings of Kinetic Email

In the past, although email clients such as Apple Mail had robust modern HTML and CSS support, the vast majority of email clients didn’t. This forced email designers to code for the lowest common denominator.
The launch of the iPhone changed everything. The iPhone email client, like Apple Mail, supported modern HTML5 & CSS3. However, the immense popularity and adoption of the iPhone – and later the similarly capable Android phones – gave designers a reason to create email designs tailored for the mobile screen. Using media queries, designers were able to create mobile optimized responsive layouts.

Once designers started to experiment with responsive layouts, they discovered CSS tricks that allowed email to be interactive and dynamic. In 2011, Campaign Monitor posted an article on implementing “progressive disclosure” in email where hidden email content in mobile could be selectively displayed when the recipient tapped on a button.

In 2013, LinkedIn introduced a tool called Intro. It was an add-on for the iPhone email client that inserted a toolbar at the top of an email containing information about the sender. The interactive nature of the toolbar seemed as if LinkedIn had modified the iPhone email client itself or somehow found a way to use JavaScript in email. It turned out the engineers at LinkedIn discovered a way to embed interactive CSS into an email that would render in the iPhone email client!

Kinetic Email vs Interactive Email

Isn’t kinetic just a different way to describe interactive email?

No. For two reasons – the term interactive email comes with some baggage and kinetic encompasses more than just interactivity.
Interactive email comes with baggage because various forms of technologies have been called “interactive email” – email that required users to install proprietary software to experience interactivity; emails that contain video and animated gifs; and emails with call-to-actions that spur the user to click to landing pages and do an interactive activity such as vote, take a survey, or play a game. I wouldn’t consider any of these true kinetic email.

I also believe that kinetic should include techniques that make an email dynamic but not necessarily interactive – such as CSS animation and transitions and time triggered display of content. Although video and animated gif images can be considered dynamic, I feel that kinetic should be limited to the use of CSS to dynamically control elements in email and not simply display dynamic media.

So What Really is Kinetic Email?

At the core, kinetic email encompasses interactive and dynamic designs in email that are implemented completely in HTML and CSS. Going further, we could categorize kinetic email into three distinct types:

  • Kinetic
    Email that uses CSS transitions and animation to deliver key content in a campaign. An example is an automatic sliding carousel with each slide displaying a different set of content.
  • Kinetic Interactive
    Kinetic email with the addition of elements that respond to user action. For example, user driven carousels containing navigation buttons, collapsible menus and elements that use progressive disclosure. Kinetic interactive emails would typically involve use of the :hover, :active, :focus or :checked CSS selectors.
  • Kinetic Effects
    The term kinetic effects can be used when CSS animations and interactivity are mainly used to embellish content. For example, highlighting content upon hovering, falling snow and CSS entrance and attention focusing effects.
Kinetic emails also often incorporate fallback techniques that ensure that these emails do not render poorly on email clients that do not support kinetic content. For example, kinetic content may simply be hidden or an alternative simpler static layout may be displayed.

Below you will find some examples

User Controlled Carousel (Kinetic Interactive)

Creator: Oracle for B&Q
Background
Source

Falling Snow (Kinetic Effect)

Creator: Wax Media for B&Q
Source

Collapsible Menu (Kinetic Interactive)

Creator: JM Web Services for PBC Credit Union
Background
Source

Carousel with Navigation Controls (Kinetic Interactive)

Creator: Nest Labs
Background
Source

Realtime External CSS Driven Twitter Feed (Kinetic)

Litmus
Background

At Retentiongrid they’re able to embed real-time content from Twitter, Facebook and Instagram into any email, if we are willing to have it in our clients email we can get in touch with Kevin Dykes (CEO), obviously they sell the script, but we can make our clients pay for it.

What is not Kinetic?

Anything that isn’t HTML or CSS, dynamic and supported natively by an email client is not kinetic.

Kinetic email is not:

  • Animated gifs
  • Kinetic Interactive
  • Video in email
  • Interactive content that requires non-native plugins
  • Image based “realtime” content that is generated on the server when the email is opened. However, kinetic email can leverage attributes of realtime (see twitter feed example above)
  • Off email interactivity. Emails that contain content such as placeholder images that elicit a click by the user to a landing page where the real interactivity resides

What’s Next for Kinetic Email?

Although kinetic email is not a substitute for a well-crafted and targeted campaign, when used appropriately kinetic email can bolster a brand’s message and increase the recipients’ engagement and delight.

We believe that kinetic email has the potential to attract new interest to email – especially from developers. Who knows? The email client developers at Google, Yahoo! and Microsoft might even begin to take HTML support seriously.

Email Marketing trends 2019

Web fonts in HTML emails

HTML LIVE DEMO

Strong hand coding of emails, use of segments, AMPSCRIPTS.

If you like to see more Email Demo click here
or
if you like to see an HTML website, totally hand coded, please go here



Video is engaging and entertaining and in an email can lead to open rate increases of 19% and click-through rate increases upwards of 50 percent! Check here how to embed a video in Responsive HTML Email

VIDEO IN HTML EMAILS.



A fancy way how to show products or ads in your HTML Emails. Works in Webkit based clients: iOS Mail, Apple Mail, Outlook for Mac.

See the Pen Responsive Animated Carousel for Email

Responsive Animated Carousel with different animation



A responsibe image carousel that will render in many major email clients.
Works on: iOS Mail, Samsung Mail, Apple Mail, Yahoo! Mail, AOL and Outlook 2003.

Displays static image on Outlook 2007-2016, Outlook.com and Gmail

HTML carousel image with thumb (3 or 5 thumb)



Rollovers for Mobile and Non-Mobile Email to emphasize your products in emails

Responsive Rollover for Email.


See the Pen Rollovers for Mobile and Non-Mobile Email



CSS3 Animations for Marvolio’s Nostrum

Animated arrow for Marvolio’s Nostrum.


See the Pen A floating tequila bottle with balloon effect.



Sprite CSS Bird

See the Pen Bird sprite css

Portfolio

Here is a showcase of my works

Prototypes

HTML responsive email

HTML Emails

Developement

Marvolio’s Nostrum

HTML Website Design

Mooza Email Sample

HTML responsive email

VHX Records

HTML Website Design

My Skills

My area of expertise

Contact Me

Drop me a line