It’s About Time 2014 – Brian & Semone Joseph’s Wedding Website

It’s About Time 2014 – Brian & Semone Joseph’s Wedding Website


I was originally asked to design a wedding invitation – for a couple of my friends – that included a timeline infographic of their relationship together. We came up with numerous design ideas for the project including paper type, dimensions and costs for the project. I finally decided to surprise them by designing and developing a website that would include the timeline infographic and also include an RSVP form for guests, as well as, a custom app from weddingpartyapp.com, which gives their guests the ability to post pictures, videos and comments of various events leading up to their wedding day. It also gave the bride and groom access to add registry information and other events for their wedding day.

I wanted to keep the website very visual and easy to navigate. So, I decided to go with a one-page scrolling website using HTML5 and added some CSS3 animations to give the site some personality. I also wanted to make the site be functional for the guests who were invited to the wedding and directed to the website. I decided to include directions for the ceremony and reception using Google maps, which saved the bride and groom from printing card inserts for the directions into their formal invitations. Since I was also saving print costs for the direction cards, I decided on created a dynamic RSVP form, which would allow their guests to respond to their invite and indicate their meal choice(s) for the wedding reception. The bride and groom also invited family members and friends that would potentially be accompanied with multiple guests (a maximum of 7 to be exact). I chose to create a form using Javascript and PHP that would dynamically add fields to the form once the user entered a value in the “number guests” field. This design and functionality made for a much cleaner and condensed form, which allowed the page to become less cluttered and less intimidating to the user. Lastly, to keep the form consistent with the rest of the site, I created custom confirmation pages depending on whether the guest was attending or not attending. I kept inline with the same solid-coloured 2D (aka “flat”) vector illustration theme of the site. The graphics and copy remained consistent and reflected the fun personality of the bride and groom.

Overall, Brian & Semone loved the design and copy written on the website. They also found the inclusion of the mobile app, Google maps and RSVP form to be very useful and cost effective.

Check out some of the sites screenshots below. I’ve also placed links to the website and RSVP confirmation pages. Let me know what you think of this project by leaving a comment or liking the project below.

Languages:

HTML5
CSS3
Javascript/jQuery
PHP

Software/Skills:

Adobe Illustrator.
Coda2
Copy writing

 

Launch ItsAboutTime2014

One-page scroll with CSS3 Animations.

HTML5 One-page scrolling site with CSS3 Animations.

Dynamic RSVP form

Dynamic RSVP form using Javascript and PHP

Attending & non-attending confirmations

Attending & non-attending confirmation pages

 

Attending Confirmation

Not-Attending Confirmation

 

 

2 Comments

Add yours
  1. 1
    Semone

    Mark,
    Thank you so much for working on this site for us…we LOVE it! It really captures a lot of our personality and the little details make it so personalized and special to us. I really adore the App you helped to create as well, all things that will help make our big day even more special. I particularly like how cost effective the site allows us to be, by saving on costs to print maps, rsvp cards and stamps. We’ve gotten so much feedback already about how great the site is…you’re creativity and humour are phenomenal. Beyond anything we could have thought or imagined…you’re amazing.

    Semone

+ Leave a Comment