<div class="swiper-container swiper-container-h">
<div class="swiper-wrapper"><div class="swiper-slide">
<picture>
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-01-768x433.jpg" media="(max-width: 768px)">
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-01-1000x563.jpg" media="(min-width: 769px) and (max-width: 1000px)">
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-01.jpg" media="(min-width: 1001px) and (max-width: 1536px)">
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-01.jpg" media="(min-width: 1537px)">
<img src="https://tomrobison.com/wp-content/uploads/openeco-01.jpg" alt="">
</picture></div><!-- .swiper-slide --><div class="swiper-slide">
<picture>
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-02-768x433.jpg" media="(max-width: 768px)">
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-02-1000x563.jpg" media="(min-width: 769px) and (max-width: 1000px)">
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-02.jpg" media="(min-width: 1001px) and (max-width: 1536px)">
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-02.jpg" media="(min-width: 1537px)">
<img src="https://tomrobison.com/wp-content/uploads/openeco-02.jpg" alt="">
</picture></div><!-- .swiper-slide --><div class="swiper-slide">
<picture>
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-03-768x433.jpg" media="(max-width: 768px)">
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-03-1000x563.jpg" media="(min-width: 769px) and (max-width: 1000px)">
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-03.jpg" media="(min-width: 1001px) and (max-width: 1536px)">
<source srcset="https://tomrobison.com/wp-content/uploads/openeco-03.jpg" media="(min-width: 1537px)">
<img src="https://tomrobison.com/wp-content/uploads/openeco-03.jpg" alt="">
</picture></div><!-- .swiper-slide --></div><!-- .swiper-wrapper -->
</div><!-- .swiper-container swiper-container-h -->
<div class="swiper-container swiper-container-h">
<div class="swiper-wrapper"><div class="swiper-slide">
<picture><!-- tablet -->
<source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/OpenEcoTablet-01-768x768.jpg" />
<source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/OpenEcoTablet-01-1000x1000.jpg" />
<source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/OpenEcoTablet-01.jpg" />
<img src="https://tomrobison.com/wp-content/uploads/OpenEcoTablet-01.jpg" alt="" />
</picture></div><!-- .swiper-slide --><div class="swiper-slide">
<picture><!-- tablet -->
<source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/OpenEcoTablet-02-768x768.jpg" />
<source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/OpenEcoTablet-02-1000x1000.jpg" />
<source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/OpenEcoTablet-02.jpg" />
<img src="https://tomrobison.com/wp-content/uploads/OpenEcoTablet-02.jpg" alt="" />
</picture></div><!-- .swiper-slide --></div><!-- .swiper-wrapper -->
</div><!-- .swiper-container swiper-container-h -->
<div class="swiper-container swiper-container-h">
<div class="swiper-wrapper"><div class="swiper-slide">
<picture><!-- mobile -->
<source media="(max-width: 610px)" srcset="https://tomrobison.com/wp-content/uploads/openecosm-1-610x569.jpg" />
<source media="(min-width: 611px) and (max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/openecosm-1.jpg" />
<img src="https://tomrobison.com/wp-content/uploads/openecosm-1.jpg" alt="" />
</picture></div><!-- .swiper-slide --><div class="swiper-slide">
<picture><!-- mobile -->
<source media="(max-width: 610px)" srcset="https://tomrobison.com/wp-content/uploads/openecosm-2-610x569.jpg" />
<source media="(min-width: 611px) and (max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/openecosm-2.jpg" />
<img src="https://tomrobison.com/wp-content/uploads/openecosm-2.jpg" alt="" />
</picture></div><!-- .swiper-slide --></div><!-- .swiper-wrapper -->
</div><!-- .swiper-container swiper-container-h -->
<div class="swiper-container swiper-container-h">
<div class="swiper-wrapper"><div class="swiper-slide">
<picture><!-- tablet-wide -->
<source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-01-768x433.jpg">
<source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-01-1000x563.jpg">
<source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-01.jpg">
<source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-01.jpg">
<img src="https://tomrobison.com/wp-content/uploads/openeco-01.jpg" alt="">
</picture></div><!-- .swiper-slide --><div class="swiper-slide">
<picture><!-- tablet-wide -->
<source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-02-768x433.jpg">
<source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-02-1000x563.jpg">
<source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-02.jpg">
<source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-02.jpg">
<img src="https://tomrobison.com/wp-content/uploads/openeco-02.jpg" alt="">
</picture></div><!-- .swiper-slide --><div class="swiper-slide">
<picture><!-- tablet-wide -->
<source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-03-768x433.jpg">
<source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-03-1000x563.jpg">
<source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-03.jpg">
<source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-03.jpg">
<img src="https://tomrobison.com/wp-content/uploads/openeco-03.jpg" alt="">
</picture></div><!-- .swiper-slide --></div><!-- .swiper-wrapper -->
</div><!-- .swiper-container swiper-container-h -->
<div class="swiper-container swiper-container-h">
<div class="swiper-wrapper"><div class="swiper-slide">
<picture><!-- mobile-wide -->
<source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-01-768x433.jpg">
<source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-01-1000x563.jpg">
<source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-01.jpg">
<source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-01.jpg">
<img src="https://tomrobison.com/wp-content/uploads/openeco-01.jpg" alt="">
</picture></div><!-- .swiper-slide --><div class="swiper-slide">
<picture><!-- mobile-wide -->
<source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-02-768x433.jpg">
<source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-02-1000x563.jpg">
<source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-02.jpg">
<source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-02.jpg">
<img src="https://tomrobison.com/wp-content/uploads/openeco-02.jpg" alt="">
</picture></div><!-- .swiper-slide --><div class="swiper-slide">
<picture><!-- mobile-wide -->
<source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-03-768x433.jpg">
<source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-03-1000x563.jpg">
<source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-03.jpg">
<source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/openeco-03.jpg">
<img src="https://tomrobison.com/wp-content/uploads/openeco-03.jpg" alt="">
</picture></div><!-- .swiper-slide --></div><!-- .swiper-wrapper -->
</div><!-- .swiper-container swiper-container-h -->
Autoplay
Sun Microsystems
Carbon Calculating Micro-site
Sun Microsystems
Carbon Calculating Micro-site
Image controller:
Auto-advance images:
Personal contribution
Flash Actionscript coding.
Project features
- Application calculated user's carbon footprint from square footage, electricity and gas consumption.
- User could make their results public or keep them private.
- User could compare their results to others who had made their results public.
Project description
Sun Microsystems had built an online community-based carbon calculator, but too many people were signing up with fake information to see how it worked. Because this junk data dimished the site, I built a simulator in Flash which would give people the ability to test it on the home page before signing up. This practically eliminated the occurance of fake data.