Website Address: http://www.citibank.com
Details: I created the basic template and inital flash banner designs which got revised by Citibank marketing team and by fellow team member input. I needed to revise and rewrite the HTML department's JavaScript to use Web 2 techniques to enable the page to replace the Flash banner depending on the HTML image-button clicked. This was done by removing element nodes and then rebuilding those nodes with new flash references through JavaScript.
Skills/Software: Fireworks, PhotoShop, XHTML/HTML, CSS, JavaScript, and Flash.
Note: The first image links to a JPEG, the other are Flash mockups of the final page.
Details: These e-mail templates are for the numerous Citibank's products. I created these and choose most of the images to go with the provided copy. Some of the below used an existing e-mail template format that were developed by my other team members, but most were original designs since Citibank is changing their template designs.
Skills/Software: XHTML/HTML, CSS, Fireworks, Illustrator and PhotoShop
Note: The dotted pink line is Citibank's break point, which means it is the point of an email that they believe is viewed from the initial opening of the e-mail.
Details: This is Investacorp's back office system for their Registered Representatives. It is a password protected site, so I cann't give internal details or pictures about it. However, I have done extensive work and maintanace on this system including designing the UI for the newer 2.0, Tapresty-based version of it.
Skills/Software: XHTML/HTML, JSP, CSS, XML, Dreamweaver, PhotoShop, Illustrator, SwishMax, Flash and JavaScript (Web 2.0 techniques).
Website Address: http://www.investacorp.com
Details: This is the current website of Investacorp. It was created back in 2004 with a CSS redesign in 2005. Each of the below sample represent a template page type for the website. You can visit the site by following the above link to view the rest of it.
Skills/Software: XHTML/HTML, JSP, CSS, Dreamweaver, PhotoShop, Illustrator, SwishMax and JavaScript.
Website Address: http://www.investacorpinvestors.com
Details: A lack-luster site was put up to cover the emergency procedures and important consumer information and regulatory requirements of the NASD and SPIC.
Skills/Software: XHTML/HTML, CSS, Dreamweaver and PhotoShop.
Details: This is a neutral website design. The website was made to default to an 800 width but could be degraded to a 640 width without much distortion of the website. This was in due to the minimalistic marketing approach of the company at that time.
Skills/Software: XHTML/HTML, CSS, Notepad and PhotoShop.
Details: My first professional website which was a complete redesign with new and different copy from the prior Investacorp's website.
Skills/Software: XHTML/HTML, CSS, Notepad and PhotoShop.
Details: These sample flash banners were resized and made for various 3rd party vendors like Yahoo, Google and MSN. In addition, they appear on Citibank's own website.
Skills/Software: Flash, Fireworks, PhotoShop and Illustrator.
Details: These little flash animations were done for fun. They are silly but show some interesting stuff like Heirarchial animation and lip-syncing.
Skills/Software: Flash and Illustrator.
Details: The below tutorials are a sneak peak of the Hexagon tutorials that will be added to the Tutorial section. However, when it does get placed there, it will be also include a complete HTML+images version in addition to the Flash version as seen below.
Skills/Software: Dreamweaver, PhotoShop, Illustrator and Wink.
