Technology: css

Making Connections Every Day

This Stewardship report built showcasing the relationship between these two companies. We obviously relied heavily on parallax techniques. We applied easing effects to have the elements in each section to ease into place as you approached. Who knew algebra and cubic functions would be so fun!

DUKE TIP Website – Interactive Overview

A single, chronological view of annual Duke TIP programs and milestones relevant to you displayed in an interactive format. Heavily uses a customized jQuery fancybox plugin.

Kotter.net

Using valid HTML and CSS achieved cross browser web design from provided look and feel. Set up template files for easy site updates and maintenance.

Circlecube Video Player 4

An extensively customizable yet simple video player. Create and manage playlists for your video delivery as well as allow viewers to share and socially bookmark the video. Integrate the video into your user experience with javascript integration as well as Google Analytics tracking on the video actions! Control all functionality, full layout and all colors of the player easily! Plus, don’t sweat the embed codes – there’s an embed code generator included with easy to select options and controls!

Features:

  • Includes an embed script generator! With options for swfobject implementation or simple valid html object tags (or both)!
  • Embed generator makes setting your settings easy with a Live Preview!
  • Supports flv, f4v and any container format using H.264: mp4, m4a, mov, mp4v, 3GP, 3G2.
  • All images and video loaded externally
  • Run this player without additional files, just pass in the flv path.
  • Use an external xml playlist or set playlist values in flashvars settings. (No need for xml if you don’t want it)
  • Social Bookmarking with facebook, twitter, delicious, google buzz & linkedin
  • Send emails through the player to share the video with friends
  • Supports most image file types: jpg, gif, png.
  • Google Analytics Integration (event tracking) – Uses your analytics account on a per video setting in flashvars.
  • Load any dimension video. Completely resizable
  • Set player width and height
  • Set video width and height
  • Full screen capabilities
  • All colors fully customizable in flashvars or xml
  • Use a preview/thumbnail image.
  • Auto play option
  • Auto load option – in case you had a bunch of video on one page you wouldn’t want them all to auto load.
  • Video scale/stretching options: none, exact, uniform, fill.
  • Javascript callback functions for loading video and finishing video playback.
  • Show/hide a big play button over the video option
  • Show/hide “vcr” video player controls or have them auto-hide
  • Advanced volume controls, click to mute or drag to desired volume. Volume fades rather than cuts.
  • Support for a logo
  • Controls auto-hide
  • 66k file size
  • Time code display in current time or elapsed time. click to toggle
  • Tooltips for controls
  • Send video files to player dynamically with javascript integration (with an html link on a page send a video to play)
  • Replay video after complete
  • Progressive play and load displays. Watch as the video loads and see the scrub bar update as you watch.
  • Scrub bar is interactive click and drag. Tooltip to display hovered time.
  • Animated play controls.
  • Buttons states & tooltips.
  • All player graphics are vector shapes and very small in size.
  • Fully rearrange player controls
  • Option to disable fullscreen
  • Display video title and description – html content (may contain links)
  • Video controls also in context menu (right-click menu)
  • Loop the video once, twice however many times you wish and even infinitely!
  • Disable tooltips completely if you wish
  • Keyboard shortcut integration! Press the space bar to pause/play the video just like in most video playback programs.
  • Volume setting cached across sessions for a better user experience
  • Double click video for fullscreen

Earthwise Remedies

Website for joint remedy plus. A very simple design and a huge step up from an older design that was very “Mickey Mouse”.

Hotels Anywhere Challenge

Ad campaign with a game show feel, users would guess locations based on a picture which was constructed throughout a week. Every day the scene would be further built to give more details and hints as to the actual location. I did some graphic work piecing the scenes together and the motion graphics of the scene construction.

Sally Kolar Photography

Website design for photographer containing portfolios as galleries, scheduling calendar, blog and interactive contact form.