Beth Shearon Digital Portfolio

Woodring Wall of Honor Responsive Website created with PHP, CSS3, and JavaScript

Animated custom JavaScript billboard scrolls through menu items with corresponding images displayed in the center. Billboard is interactive: hovering over a menu item increases opacity of the name and custom flag graphic while bringing that section's photograph up in the center. Moving the mouse away from the billboard will allow the automatic slide show to resume. Clicking or tapping a menu item will take the viewer to that page on the site.

The Mission section is CSS3 interactive: hover or tap to display the mission, and move/tap away to put it away.

The site menu is a CSS3 hover dropdown. The submenus display statically in each section for mobile/touch.

Fun fact: the custom flag graphics on the billboard were made from flags at the Veterans Park, from a photograph taken by Executive Director Elaine Johns during the Red Dirt Run of Honor.

Photographs courtesy of the Woodring Wall of Honor and Veteran's Park, Inc.

This site is live: woodringwallofhonor.com

Bridge Shark Responsive Web Hub with CSS3

A destination-oriented page for visitors to the area, and a global highlight for an unconventional, artsy solution to peculiar municipal challenges.

Collage uses CSS3 interactivity via hover or tap to bring the selected photograph to the forefront of the page.

Photographs by Beth Shearon

This site is live: bridgeshark.com

Personal Responsive Web Hub with CSS3

1940 LaFrance and soccer goal photographs by Beth Shearon

wayneshearon.com

Red Dirt Run of Honor: Custom Responsive Event Website created with PHP, CSS3, a JavaScript image slide show, and a JQuery animated sponsor bar

Interactive sponsor bar pauses on hover and allows viewers to click sponsor logos if they want to visit sponsor websites. Animation resumes on mouse out.

For ultimate accessibility, the entire site has a text version.

Photographs courtesy of the Woodring Wall of Honor and Veteran's Park, Inc.

http://OKreddirtrun.com/

Sx Custom Fabrication: Custom Responsive Commercial Website front page created with CSS3 animations and transformations

CSS3 interactive "bubbles" dance around the page, but each will pause on hover/tap, expanding into a square. Moving/tapping away resumes the dance as well as the round shape of the image.

This page is the front-runner to an extensive site which is still in development.

http://sxcustomfabrication.com/

Rugged Steel Inc. Web Hub created with CSS3 and a JavaScript slide show

Photographs courtesy of Rugged Steel, Inc.

Beth Shearon Fine Art: Custom Commercial Fine Art Website created with PHP

This site loads art images and informational content from its SQL database using PHP, and uses JavaScript for image interactivity.

Fine Art Photography by Beth Shearon

This site is live: http://bethshearonfineart.com/

Sundance Wine and Spirits: Commercial Responsive and Elastic Website utilizing CSS3, SQL database, and PHP scripting
Full Custom Administrative Database Content Management System in PHP and SQL

CSS3 interactive center panel images zoom out on hover or tap, and resume original size when viewer moves/taps away.

Southwest header photograph Beth Shearon, May 2006, Hole In the Rock Trail, Utah.
Southwest silhouette vector totem graphics converted and used with permission from Stanislav: http://all-silhouettes.com/native-american-symbols/
Nat Decants is a JavaScript widget link courtesy Natalie Maclean.com

http://sundancewineandspirits.com/

Commercial Responsive and Elastic Website with PHP, CSS3, and SVG logo. Image Magic, photo editing, and photo restoration feature CSS3 hover/tap before and after transitions for both the thumbnails and the regularly sized photographs.

Airbrushed wall sign in photo was created by Wayne Shearon

This site is still up for the portfolio though the business is now closed: http://seemedigital.com/

Sumari Living Arts Center website

Responsive for mobile and large screen sizes

CSS link menu has on-hover capability with color accent blocks and enlarged selection area.
Mini-logo indicates page location in link menu, assists orientation/navigation.

Artwork: Strawberry Sauce by Saige

This site is live: http://sumaricenter.com/

Personal Responsive Web Hub with JavaScript and CSS3

Photo with the blue blouse is from the Greater Enid Chamber of Commerce November Noon Network at the Enid Convention Hall, courtesy Greater Enid Chamber of Commerce. Wedding photo taken by Debbie Shearon.

This site is live: http://bethshearon.com/

Expanded Journey website
Content-focused, non-complex design

This site is live: expanded journey

Portfolio site created with PHP, CSS3, and responsive design which fits both wide screen and mobile devices

Photo Edit section features CSS3 mouseover before and after transitions for both the thumbnails and the regularly sized photographs, and also includes an alternative page for older browsers which shows side-by-side before and after images.

This site is live: http://bethshearon.com/webportfolio/index.php