reference_450.html

---
layout: layout_fiches_ref
title: // 450
---

<div class="medium-bloc header-ref-detail">
    <div class="medium-content">
        <img src="img/ref/450/header_450.png" width="846" height="117" border="0" alt="Header reference" class="header-ref-img"/>
        <div class="reference-abstract">
            <span class="reference-title">LE COMPTE ÉPARGNE CO2</span>
            <span class="reference-subtitle">Un site pour encourager le citoyen à lutter contre le changement climatique.</span>
        </div>

    </div>
    <div class="medium-bottom">&nbsp;</div>
</div>
<hr/>
<div class="medium-bloc">
    <div class="medium-content">
        <!--<img src="img/ref/cin/screen_cin_1.png" width="416" height="231" border="0" alt="Screen de l'application" class="screen-ref"/>-->
        <div class="text-ref">
            <p>450 a créé un concept : augmenter son pouvoir d'achat en réduisant ses émissions de CO2. Ainsi le gain pour l'utilisateur est double, il réduit ses émissions
                de CO2 pour moins endommager la planète et sa bonne action est récompensée par de l'argent.</p>
            <p>Le site informe sur les effets des émissions de CO2, permet d'évaluer ses émissions de CO2 et de les comparer avec les moyennes nationales ainsi que les objectifs pour les années à
                venir.</p>
            <p>Avec ce premier bilan des émissions, plusieurs solutions personnalisées sont proposées afin de les réduire. Une fois les
                émissions de CO2 réduites, le site rémunère l'utilisateur avec des crédits CO2.</p>
        </div>
        <img src="img/ref/450/screen_450_1.png" width="416" height="231" border="0" alt="Screen de l'application" class="screen-ref"/>
    </div>
    <div class="medium-bottom">&nbsp;</div>
</div>

<div class="small-bloc screen-info-techno">
    <div class="small-content">
        <img src="img/ref/450/screen_450_2.png" width="385" height="286" border="0" alt="Screen de l'application" class="screen-ref"/>
    </div>
    <div class="small-bottom">&nbsp;</div>
</div>

<div class="small-bloc info-techno">
    <div class="small-content">
        <ul class="logo-techno-list">
            <li class="logo-techno"><img src="img/logo_techno/technoic.png" border="0" alt="technoic"/></li>
            <li class="logo-techno"><img src="img/logo_techno/guice.png" border="0" alt="guice"/></li>
            <li class="logo-techno"><img src="img/logo_techno/mybatis.png"  border="0" alt="Mybatis"/></li>
            <li class="logo-techno"><img src="img/logo_techno/elastic_search.png" border="0" alt="Elastic Search"/></li>
        </ul>
        <div class="text-ref">
            <ul>
                <li>Base de données MySQL, framework de gestion des accès à la base de données MyBatis</li>
                <li>Architecture REST (Restlet, JAXRS, Jackson) en Java : utilisation de Google Guice, du moteur de recherche ElasticSearch, d'un analyseur de contenu Apache Tika, de l'API Facebook et Twitter</li>
                <li>Moteur de template Freemarker</li>
                <li>Base de donnée Oracle RAC 11g, procédures stockée PL/SQL.</li>
                <li>Présentation en HTML avec JQuery et CSS. Affichage de graphiques avec JavaScript InfoVis Toolkit.</li>
            </ul>
        </div>
    </div>
    <div class="small-bottom">&nbsp;</div>
</div>
<hr/>
<div class="medium-bloc">
    <div class="medium-content">
        <!--<img src="img/ref/cin/screen_cin_3.png" width="416" height="231" border="0" alt="Screen de l'application" class="screen-ref"/>-->

        <div class="text-ref">
            <p>L'originalité et l'atout du sytème est de permettre aux usagers d'utiliser leurs <span class="red-text">crédits carbone comme une véritable monnaie.</span></p>
            <p>Grâce à l'accompagnement et aux propositions des 4SH, le développement de ce concept innovant a pu être possible.</p>
            <p>Le site est en <span class="red-text">production depuis plus d'un an.</span> Avec un concept unique et novateur, le site évolue régulièrement pour apporter des améliorations et des nouveautés.</p>
        </div>

        <img src="img/ref/450/screen_450_3.png" width="416" height="230" border="0" alt="Screen de l'application" class="screen-ref"/>
    </div>
    <div class="medium-bottom">&nbsp;</div>
</div>