Web Design | Easter E-Card

overview Web Design Jarell Alvarez D3 BCIT portfolio

Project Details

Client: BCIT Second Term

Date: 15 May 2016

Category: Web Design

Software: Atom.io | Illustrator

Role(s): Web Developer

purpose Web Design Jarell Alvarez D3 BCIT portfolio


This interactive e-card was designed and built for a project in term 2 of BCIT. This was built using Javascript, HTML5, CSS and Illustrator. The task was to make a personal e-card that we can give anyone we wanted to online. Within a month I created a fully working application that utilizes javascript's DOM elements to it’s fullest. I chose to make the designs rudimentary in order to focus on the coding aspect and adding as much as I possibly can within the given amount of time.

process Web Design Jarell Alvarez  D3 BCIT portfolio


I started with laying a foundation within illustrator for all my elements to be interactive using svg. After many iterations, add-ons and versions the final product is full of “easter eggs” and interactivity.

Final Outcome

An interactive e-card that utilizes web technologies that’s demonstrated my skills on using the DOM and clever elements that the user can interact with once found.