You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
101 lines
4.5 KiB
101 lines
4.5 KiB
---
|
|
layout: default
|
|
section_id: portfolio
|
|
title: Thunderbird Style Guide and Usability Study
|
|
---
|
|
|
|
<div style="background-color: #0A84FF;" 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;">Thunderbird 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/thunderbird_logo.png" alt="">
|
|
<div class="spacing"></div>
|
|
<img class="lazy" data-src="../images/projects/thunderbird_2.png" alt="">
|
|
<div class="two spacing"></div>
|
|
<img class="lazy" data-src="../images/projects/thunderbird_3.png" alt="">
|
|
<div class="spacing"></div>
|
|
<img class="lazy" data-src="../images/projects/thunderbird_4.png" alt="">
|
|
<div class="spacing"></div>
|
|
<img class="lazy" data-src="../images/projects/thunderbird_1.png" alt="Usability Study">
|
|
<div class="spacing"></div>
|
|
<img class="lazy" data-src="../images/projects/thunderbird_5.png" alt="Settings Redesign Study">
|
|
<div class="spacing"></div>
|
|
</div>
|
|
<div class="large-4 columns">
|
|
<div class="project-intro">
|
|
<p>The <a href="https://thunderbird.net" target="_blank">Thunderbird</a> project has been welcoming to suggestions and help, allowing us to enjoy the process thoroughly beyond simply handing off the deliverables.</p>
|
|
<p>To be inline with the new Firefox Photon Design system, we worked on a fork specifically tailored for Thunderbird, including a revamped logo and word mark. We also set the stage for an upcoming UI redesign in the future by conducting a small Usability Study specifically tailored on security features out-of-the-box within Thunderbird.</p>
|
|
<hr>
|
|
<div class="spacing"></div>
|
|
<h4>Date</h4>
|
|
<p><span>June, 2018</span></p>
|
|
<h4>Clients</h4>
|
|
<p><span><a href="https://thunderbird.net" target="_blank">Thunderbird</a></span></p>
|
|
<h4>Category</h4>
|
|
<p><span>Usability Study and Style Guide</span></p>
|
|
<hr>
|
|
<a class="button boxed blog" href="https://ura.design/2018/07/05/thunderbird-style-guide" target="_blank"><i class="fas fa-pencil-alt"></i> Blogpost</a><br />
|
|
<a class="button boxed black" href="https://github.com/uracreative/works/tree/main/Thunderbird" target="_blank"><i class="fab fa-github"></i> Sources</a><br />
|
|
<a class="button boxed identihub" href="https://demo.identihub.co/thunderbird" target="_blank"><img class="lazy" data-src="../images/projects/identihub.svg" > Identihub</a><br />
|
|
<a class="button boxed thunderbird" href="https://github.com/uracreative/works/raw/main/Thunderbird/Thunderbird%20Usability%20Study.pdf" target="_blank"><i class="fas fa-globe"></i> Usability Study</a>
|
|
<a class="button boxed thunderbird" href="https://github.com/uracreative/works/raw/main/Thunderbird/Settings%20Redesign%20-%20Sources/Usability%20Study%20for%20Thunderbird%20Settings.pdf" target="_blank"><i class="fas fa-globe"></i> Settings Redesign - Usability Study</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</h3>
|
|
<p>Style Guide</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="large-4 columns">
|
|
<div class="work-wrapper">
|
|
<a href="tor-style-guide" class="work">
|
|
<img class="lazy" data-src="../images/projects/tor_thumb.png" alt="">
|
|
<div class="info">
|
|
<h3>Tor Style Guide</h3>
|
|
<p>Style Guide</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>Rebranding</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|