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.
246 lines
9.3 KiB
246 lines
9.3 KiB
---
|
|
layout: default
|
|
section_id: home
|
|
slides:
|
|
- text: <span>USABILITY</span> AND <span>OPEN SOURCE DESIGN</span>
|
|
subtitle: Ura supports Open Source and Free Software Projects with Usability, Visual Identity and User Experience Design, no matter if small grassroots or established enterprise.
|
|
overlay: overlay
|
|
button:
|
|
text: What is it?
|
|
url: http://opensourcedesign.net
|
|
bg_color: "#3399d4"
|
|
image: images/@stock/half-1.jpg
|
|
- text: Host your Visual Assets with <span>Identihub</span>
|
|
subtitle: Identihub is free open source software designed to host your brand and visual assets in a single place, making it convenient to share with others.
|
|
overlay: overlay grey
|
|
button:
|
|
text: Try it out
|
|
url: https://identihub.co
|
|
bg_color: "#58595B"
|
|
image: images/@stock/half-3.jpg
|
|
- text: Across <span>industry</span> and <span>communities</span>
|
|
subtitle: We understand Open Source and Communities unlike most design agencies. Have a look at our past projects to see if we are a good fit.
|
|
overlay: overlay
|
|
button:
|
|
text: Showcases
|
|
url: projects
|
|
bg_color: "#3399d4"
|
|
image: images/@stock/half-4.jpg
|
|
- text: REQUEST <span>DESIGN</span> AND <span>USABILITY</span> SERVICES
|
|
subtitle: Need help with your project? Request a free consultation for your Open Source Project and we handle the rest.
|
|
overlay: overlay grey
|
|
button:
|
|
text: REQUEST SERVICES
|
|
url: request
|
|
bg_color: "#58595B"
|
|
image: images/@stock/half-5.jpg
|
|
|
|
works_left:
|
|
- title: Open Labs Hackerspace
|
|
link_to: /projects/openlabs
|
|
image: images/@stock/openlabs.jpg
|
|
categories: Rebranding
|
|
- title: OpenChain
|
|
link_to: /projects/openchain
|
|
image: images/@stock/penguins.jpg
|
|
categories: Visual
|
|
|
|
works_right:
|
|
- title: Software Freedom Kosova
|
|
link_to: /projects/sfk16
|
|
image: images/@stock/poster_SFK.jpg
|
|
categories: Visual ID, Print
|
|
- title: Mozilla L10N T-Shirts
|
|
link_to: /projects/mozilla-l10n
|
|
image: images/@stock/mozilla-l10n.jpg
|
|
categories: Print
|
|
|
|
testimonials_left:
|
|
- author: Jeff Beatty - Mozilla
|
|
content: “The folks at Ura were very professional in learning our expectations, planning the project, and being flexible as things changed. Add to that their commitment to work in the open and it made for a wonderful experience.”
|
|
avatar: images/@stock/jeffbeatty.png
|
|
- author: Benjamin Kerensa - Glucosio
|
|
content: “When looking for an identity for Glucosio we put our faith into Ura. With an unrivaled ability to bring ideas together into a fresh and modern branding experience we were really happy with the results.”
|
|
avatar: images/@stock/benjaminkerensa.png
|
|
testimonials_right:
|
|
- author: Patrick Schleizer - Whonix
|
|
content: “I highly recommend Ura. The quality of their work rates, responsiveness, community engagement and patience is exemplary. I am looking forward to further cooperation.”
|
|
avatar: images/@stock/patrickschleizer.png
|
|
- author: Sara Sinclair Brody - Simply Secure
|
|
content: “Ura understood the needs of the open-source community when we worked together creating a styleguide for the Tor Project. They were able to deliver a polished result in a large, distributed volunteer organization.”
|
|
avatar: images/@stock/simplysecure.png
|
|
|
|
clients:
|
|
- image: images/@stock/mozilla.png
|
|
url: https://mozilla.org
|
|
- image: images/@stock/tor.png
|
|
url: https://www.torproject.org/
|
|
- image: images/@stock/linuxfoundation.png
|
|
url: https://www.linuxfoundation.org
|
|
- image: images/@stock/fsfe.png
|
|
url: https://fsfe.org/
|
|
- image: images/@stock/stickermule.png
|
|
url: https://stickermule.com/
|
|
---
|
|
|
|
<div class="full no-padding" style="height: 100vh;">
|
|
<div id="slides">
|
|
<div class="slides-container">
|
|
{% for slide in page.slides %}
|
|
<div class="slide">
|
|
<div class="slide-info">
|
|
<p>{{ slide.title }}</p>
|
|
<h1>{{ slide.text }}</h1>
|
|
<div class="one spacing"></div>
|
|
<p style="line-height: 1.3;">{{ slide.subtitle }}</p>
|
|
<div class="one spacing"></div>
|
|
<a href="{{ slide.button.url }}" class="button boxed white">{{ slide.button.text }}</a>
|
|
</div>
|
|
<div class="slide-left" style="background-color: {{ slide.bg_color }};">
|
|
</div>
|
|
<div class="slide-right {{ slide.overlay }}" style="background: url({{ slide.image }}) center center no-repeat;background-size: cover;">
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
<nav class="slides-navigation">
|
|
<a href="#" class="next"><i class="icon-arrows-slim-right"></i></a>
|
|
<a href="#" class="prev"><i class="icon-arrows-slim-left"></i></a>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="full">
|
|
<div class="section-title">
|
|
<div class="row">
|
|
<div class="medium-10 medium-centered columns">
|
|
<img src="images/@stock/icon.svg" alt="" class="wow flipInY" data-wow-duration="2s" data-wow-delay="0.1s">
|
|
<div class="spacing"></div>
|
|
<h2>Design, but Open</h2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="large-10 large-centered columns">
|
|
<p>Ura is the digital agency which focuses on visual communication solutions tailored for Open Source and Internet Freedom projects. Ura was founded in 2016 in Albania to cater to the ever-rising demand for Usability and Design services in Open Source Software. Among others, we are specialized in UX Design, Design Systems Research and Visual Identity.</p>
|
|
<p>Our work can be seen across various Open Source projects such as Mozilla. The Tor Project and The Linux Foundation.</p>
|
|
<p>We also develop <a href="https://identihub.co" target="_blank">Identihub</a>, Open Source Software to self-host visual assets and identities to ease collaboration between designers and developers.</p>
|
|
<div class="two spacing"></div>
|
|
<div class="centered-text">
|
|
<a href="about" class="button boxed blue">Learn more</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="full light-grey no-padding">
|
|
<div class="two spacing"></div>
|
|
<div class='row'>
|
|
<div class='large-12 columns'>
|
|
<div class='clients'>
|
|
{% for client in page.clients %}
|
|
<div><a href="{{client.url}}" target="blank"><img alt="" src="{{site.baseurl}}/{{client.image}}" width="200px" height="120px"></a></div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="two spacing"></div>
|
|
</div>
|
|
|
|
<div class="full no-padding">
|
|
<div class="four spacing"></div>
|
|
<div class="spacing"></div>
|
|
<div class="section-title">
|
|
<div class="row">
|
|
<div class="medium-10 medium-centered columns">
|
|
<h2>Recent projects</h2>
|
|
<p>You will love what we have done</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="large-6 columns">
|
|
<div class="gallery-left-section">
|
|
{% for work in page.works_left %}
|
|
<div class="work-wrapper">
|
|
<a href="{{work.link_to}}" class="work">
|
|
<img src="{{site.baseurl}}/{{work.image}}" alt="">
|
|
<div class="info">
|
|
<h3>{{work.title}}</h3>
|
|
<p>{{work.categories}}</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
<div class="large-6 columns">
|
|
<div class="gallery-right-section">
|
|
{% for work in page.works_right %}
|
|
<div class="work-wrapper">
|
|
<a href="{{work.link_to}}" class="work">
|
|
<img src="{{site.baseurl}}/{{work.image}}" alt="">
|
|
<div class="info">
|
|
<h3>{{work.title}}</h3>
|
|
<p>{{work.categories}}</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="spacing"></div>
|
|
</div>
|
|
<div class="full">
|
|
<div class="section-title">
|
|
<div class="row">
|
|
<div class="medium-10 medium-centered columns">
|
|
<h2>Testimonials</h2>
|
|
<p>What people say about us</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="large-6 columns">
|
|
{% for testimonial in page.testimonials_left %}
|
|
<div class="quote wow slideInLeft" data-wow-delay="{{ 0.25 | times:forloop.index0 }}s">
|
|
<div class="row">
|
|
<div class="small-3 columns">
|
|
<img src="{{testimonial.avatar}}" width="102px" height="102px" alt="author">
|
|
</div>
|
|
<div class="small-9 columns">
|
|
<p>{{testimonial.content}}</p>
|
|
<p class="author">{{testimonial.author}}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
<div class="large-6 columns">
|
|
{% for testimonial in page.testimonials_right %}
|
|
<div class="quote reverse wow slideInRight" class="wow" data-wow-delay="{{ 0.25 | times:forloop.index0 }}s">
|
|
<div class="row">
|
|
<div class="small-3 columns">
|
|
<img src="{{testimonial.avatar}}" width="102px" height="102px" alt="author">
|
|
</div>
|
|
<div class="small-9 columns">
|
|
<p>{{testimonial.content}}</p>
|
|
<p class="author">{{testimonial.author}}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="full light-grey no-padding">
|
|
<div class="two spacing"></div>
|
|
<div class='row'>
|
|
<div class='medium-10 medium-centered centered-text columns'>
|
|
<p>Stay updated with our Newsletter!</p>
|
|
<a class="button boxed black" href="https://tinyletter.com/uracreative" target="_blank">SUBSCRIBE</a>
|
|
</div>
|
|
<div class="two spacing"></div>
|
|
</div>
|
|
|