ura.design/projects/i2p.html

---
layout: default
section_id: portfolio
title: I2P Style Guide and Usability Study
---

<div style="background-color: #4661A9;" class="full new">
  <div class="section-title new">
    <div class="row">
      <div class="medium-10 medium-centered columns">
        <h1 class="wow slideInUp" style="color: white; font-size: 2rem;">I2P Style Guide and Usability Study</h1>
      </div>
    </div>
  </div>
</div>
<div class="full text">
  <div class="row">
    <div class="large-8 columns">
      <img class="lazy" data-src="../images/projects/i2p_logo.png" alt="I2P logo">
      <div class="spacing"></div>
      <img class="lazy" data-src="../images/projects/i2p_image_1.png" alt="Colors">
      <div class="spacing"></div>
      <img class="lazy" data-src="../images/projects/i2p_image_2.png" alt="Typography">
      <div class="spacing"></div>
      <img class="lazy" data-src="../images/projects/i2p_image_3.png" alt="Buttons/Badges">
      <div class="spacing"></div>
      <img class="lazy" data-src="../images/projects/i2p_image_4.png" alt="Cards">
      <div class="spacing"></div>
      <img class="lazy" data-src="../images/projects/i2p_image_5.png" alt="Footer">
      <div class="spacing"></div>
      <img class="lazy" data-src="../images/projects/i2p_image_6.png" alt="Writing">
      <div class="spacing"></div>
    </div>
    <div class="large-4 columns">
      <div class="project-intro">
        <p>I2P (The Invisible Internet Project) is an anonymous overlay network  - a network within a network. It protects communication from dragnet surveillance methods and monitoring by third parties such as ISPs.</p>
        <p>I2P is used by many people who care about their privacy: activists, oppressed people,  and whistleblowers, as well as the average person. No network can be "perfectly anonymous" The continued goal of I2P is to make attacks more and more difficult to mount.</p>
        <hr>
        <div class="spacing"></div>
        <h4>Date</h4>
        <p><span>October, 2018</span></p>
        <h4>Clients</h4>
        <p><span><a href="https://geti2p.net" target="_blank" rel="noopener">I2P</a></span></p>
        <h4>Category</h4>
        <p><span>Style Guide and Usability Study</span></p>
         <hr>
        <a class="button boxed blog" href="https://ura.design/" target="_blank"><i class="fas fa-pencil-alt"></i> Blogpost</a><br />
        <a class="button boxed black" href="https://github.com/uracreative/works/tree/master/I2P" target="_blank" rel="noopener"><i class="fab fa-github"></i> Sources</a><br />
         <a class="button boxed identihub" href="https://demo.identihub.co/i2p" target="_blank" rel="noopener"><img class="lazy" data-src="../images/projects/identihub.svg" > Identihub</a><br />
        <a class="button boxed i2p" href="https://uracreative.github.io/i2p-styleguide" target="_blank" rel="noopener"><i class="fas fa-globe"></i> Website</a><br />
        <a class="button boxed i2p" href="https://github.com/uracreative/works/raw/master/I2P/Usability%20Study/I2P%20Usability%20Study.pdf" target="_blank"><i class="fas fa-globe"></i> Usability Study (PDF)</a><br />
        <a class="button boxed i2p" href="https://github.com/uracreative/works/raw/master/I2P/Usability%20Study/I2P%20Usability%20Study%20Source%20Document.odt" target="_blank"><i class="fas fa-globe"></i> Usability Study (ODT)</a>
      </div>
    </div>
  </div>
</div>
<hr>
<div class="full">
  <div class="section-title">
    <div class="row">
      <div class="medium-10 medium-centered columns">
        <h2>Related projects</h2>
      </div>
    </div>
  </div>
  <div class="related-works">
    <div class="row">
      <div class="large-4 columns">
        <div class="work-wrapper">
          <a href="reproducible-builds" class="work">
            <img class="lazy" data-src="../images/projects/rb_thumbnail.png" alt="">
            <div class="info">
              <h3>Reproducible Builds Style Guide</h3>
              <p>Style Guide</p>
            </div>
          </a>
        </div>
      </div>
      <div class="large-4 columns">
        <div class="work-wrapper">
          <a href="thunderbird" class="work">
          <img class="lazy" data-src="../images/projects/tb_overview.png" alt="">
          <div class="info">
            <h3>Thunderbird Style Guide and Usability Study</h3>
            <p>Style Guide | Usability Study</p>
          </div>
        </a>
        </div>
      </div>
      <div class="large-4 columns">
        <div class="work-wrapper">
          <a href="enigmail" class="work">
            <img class="lazy" data-src="../images/projects/enigmail_overview.png" alt="">
            <div class="info">
              <h3>Enigmail Rebranding</h3>
              <p>Visual Identity</p>
            </div>
          </a>
        </div>
      </div>
    </div>
  </div>

</div>