Browse Source

possible revert to fix problems

redesign
Anxhelo Lushka 6 years ago
parent
commit
6ca49b52b1
No known key found for this signature in database GPG Key ID: 86086158C83770F8
  1. 3
      _config.yml
  2. 108
      _includes/footer.html
  3. 7
      _includes/head.html
  4. 2
      _includes/header-404.html
  5. 2
      _includes/header-post.html
  6. 2
      _layouts/default-post.html
  7. 4
      _layouts/default.html
  8. 2
      _layouts/post.html
  9. 12
      _posts/2017-01-24-wikispeech-wikimedia-project-has-a-logo-guess-who-designed-it.md
  10. 20
      _posts/2017-02-11-open-source-design-workshop-open-labs-hackerspace-tirana.md
  11. 20
      _posts/2017-08-25-ura-sha-2017.md
  12. 10
      _posts/2018-01-09-ura-work-week-november-2017.md
  13. 10
      _posts/2018-01-15-chaos-communication-congress-2017.md
  14. 14
      _posts/2018-02-09-ura-fosdem-2018.md
  15. 20
      _posts/2018-02-23-inkscape-workshop-tirana.md
  16. 14
      _posts/2018-03-12-ura-now-part-open-tech-funds-usability-lab.md
  17. 2
      _posts/2018-03-19-new-ura-website.md
  18. 4
      _posts/2018-03-31-introducing-cryptopayments-for-our-services.md
  19. 2
      about.html
  20. 4
      blog/index.html
  21. 2
      css/app.css
  22. 1
      css/linea-arrows-styles.css
  23. 1
      css/linea-styles.css
  24. 4
      css/slick-theme.css
  25. 12
      css/style.css
  26. BIN
      images/projects/tb_overview.png
  27. 28
      index.html
  28. 3
      js/.htaccess
  29. 301
      js/lazyload.js
  30. 2
      js/lazyload.min.js
  31. 11
      projects/index.html
  32. 91
      projects/libocon.html

3
_config.yml

@ -18,7 +18,8 @@ github_username: uracreative
# Build settings # Build settings
markdown: kramdown markdown: kramdown
plugins:
gems:
- jekyll-paginate - jekyll-paginate
- jekyll-compose - jekyll-compose

108
_includes/footer.html

@ -1,57 +1,51 @@
<div class="full no-padding footer blue centered-text"> <div class="full no-padding footer blue centered-text">
<div class="two spacing"></div> <div class="two spacing"></div>
<div class="row"> <div class="row">
<div class="small-12 columns"> <div class="small-12 columns">
<p>Made with <i class="fa fa-heart" style="color: red;" aria-hidden="true"></i> in <a href="https://en.wikipedia.org/wiki/Tirana" target="_blank" rel="noopener">Tirana, Albania</a><p> <p>Made with <i class="fa fa-heart" style="color: red;" aria-hidden="true"></i> in <a href="https://en.wikipedia.org/wiki/Tirana" target="_blank">Tirana, Albania</a><p>
<div class="one spacing"></div> <div class="one spacing"></div>
<ul class="socials"> <ul class="socials">
<li><a href="https://twitter.com/uracreative" target="_blank" rel="noopener"><i class='fab fa-twitter'></i></a></li> <li><a href="https://twitter.com/uracreative" target="_blank"><i class='fab fa-twitter'></i></a></li>
<li><a href="https://github.com/uracreative/ura.design/" target="_blank" rel="noopener"><i class='fab fa-github'></i></a></li> <li><a href="https://github.com/uracreative/ura.design/" target="_blank"><i class='fab fa-github'></i></a></li>
</ul> </ul>
<p>Committed to Free Software, Internet Freedom, and <a href="http://opensourcedesign.net/" target="_blank" rel="noopener">Open Source Design</a></p> <p>Committed to Free Software, Internet Freedom, and <a href="http://opensourcedesign.net/">Open Source Design</a></p>
<p> Trademarks are property of their respective owners. All site content, unless otherwise noted, is licensed <a href="http://creativecommons.org/licenses/by-sa/4.0" target="_blank" rel="noopener">CC BY-SA 4.0 International</a> by Ura Design</p> <p> Trademarks are property of their respective owners. All site content, unless otherwise noted, is licensed <a href="http://creativecommons.org/licenses/by-sa/4.0">CC BY-SA 4.0 International</a> by Ura Design</p>
<p><a href="https://tinyletter.com/uracreative/archive" target="_blank" rel="noopener">Newsletter Archive</a></p> <p><a href="https://tinyletter.com/uracreative/archive" target="_blank">Newsletter Archive</a></p>
<p><a href="{{ site.baseurl }}/privacy-policy" target="_blank" rel="noopener">Privacy Policy</a></p> <p><a href="{{ site.baseurl }}/privacy-policy" target="_blank">Privacy Policy</a></p>
<div class="two spacing"></div> <div class="two spacing"></div>
<p class="back-to-top"><a href="#"><i class="fa fa-chevron-up"></i>Back to top</a></p> <p class="back-to-top"><a href="#"><i class="fa fa-chevron-up"></i>Back to top</a></p>
</div> </div>
</div> </div>
<div class="spacing"></div> <div class="spacing"></div>
</div> </div>
<script src="{{ "/bower_components/jquery/dist/jquery.min.js" | prepend: site.baseurl }}"></script> <script src="{{ "/bower_components/jquery/dist/jquery.min.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/bower_components/foundation/js/foundation.min.js" | prepend: site.baseurl }}"></script> <script src="{{ "/bower_components/foundation/js/foundation.min.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/js/jquery.superslides.min.js" | prepend: site.baseurl }}"></script> <script src="{{ "/js/jquery.superslides.min.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/js/slick.min.js" | prepend: site.baseurl }}"></script> <script src="{{ "/js/slick.min.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/js/wow.min.js" | prepend: site.baseurl }}"></script> <script src="{{ "/js/wow.min.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/js/jquery.validate.js" | prepend: site.baseurl }}"></script> <script src="{{ "/js/jquery.validate.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/bower_components/countto/jquery.countTo.js" | prepend: site.baseurl }}"></script> <script src="{{ "/bower_components/countto/jquery.countTo.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/bower_components/appear/jquery.appear.js" | prepend: site.baseurl }}"></script> <script src="{{ "/bower_components/appear/jquery.appear.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/js/app.js" | prepend: site.baseurl }}"></script> <script src="{{ "/js/app.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/js/svg.js" | prepend: site.baseurl }}"></script> <script src="{{ "/js/svg.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/js/cookie.js" | prepend: site.baseurl }}"></script> <script src="{{ "/js/cookie.js" | prepend: site.baseurl }}"></script>
<!-- Matomo --> <!-- Matomo -->
<script type="text/javascript"> <script type="text/javascript">
var _paq = _paq || []; var _paq = _paq || [];
/ tracker methods like "setCustomDimension" should be called before "trackPageView" / / tracker methods like "setCustomDimension" should be called before "trackPageView" /
_paq.push(["setCookieDomain", "*.ura.design"]); _paq.push(["setCookieDomain", "*.ura.design"]);
_paq.push(['trackPageView']); _paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']); _paq.push(['enableLinkTracking']);
(function() { (function() {
var u="//analytics.ura.design/"; var u="//analytics.ura.design/";
_paq.push(['setTrackerUrl', u+'piwik.php']); _paq.push(['setTrackerUrl', u+'piwik.php']);
_paq.push(['setSiteId', '2']); _paq.push(['setSiteId', '2']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s); g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})(); })();
</script> </script>
<script> <noscript><p><img src="//analytics.ura.design/piwik.php?idsite=2&rec=1" style="border:0;" alt="" /></p></noscript>
var myLazyLoad = new LazyLoad({ <!-- End Matomo Code -->
elements_selector: ".lazy"
});
</script>
<noscript><p><img src="//analytics.ura.design/piwik.php?idsite=2&rec=1" style="border:0;" alt="" /></p></noscript>
<!-- End Matomo Code -->

7
_includes/head.html

@ -1,7 +1,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% if page.title %}{{ page.title | escape }}{% else %}{{ site.title | escape }}{% endif %}</title> <title>{% if page.title %}{{ page.title | escape }}{% else %}{{ site.title | escape }}{% endif %}</title>
<meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}"> <meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
@ -38,7 +38,7 @@
<meta name="twitter:image:src" content="https://ura.design/{{ page.images }}" /> <meta name="twitter:image:src" content="https://ura.design/{{ page.images }}" />
<link rel="stylesheet" href="{{ "/css/app.css" | prepend: site.baseurl }}"> <link rel="stylesheet" href="{{ "/css/app.css" | prepend: site.baseurl }}">
<link rel="stylesheet" href="{{ "/fonts/overpass/overpass.css" | prepend: site.baseurl }}"> <link href="{{ "/fonts/overpass/overpass.css" | prepend: site.baseurl }}" rel="stylesheet">
<link rel="stylesheet" href="{{ "/css/superslides.css" | prepend: site.baseurl }}"/> <link rel="stylesheet" href="{{ "/css/superslides.css" | prepend: site.baseurl }}"/>
<link rel="stylesheet" href="{{ "/css/slick-theme.css" | prepend: site.baseurl }}"/> <link rel="stylesheet" href="{{ "/css/slick-theme.css" | prepend: site.baseurl }}"/>
<link rel="stylesheet" href="{{ "/css/slick.css" | prepend: site.baseurl }}"/> <link rel="stylesheet" href="{{ "/css/slick.css" | prepend: site.baseurl }}"/>
@ -48,8 +48,7 @@
<link rel="stylesheet" href="{{ "/css/fontawesome-all.css" | prepend: site.baseurl }}"/> <link rel="stylesheet" href="{{ "/css/fontawesome-all.css" | prepend: site.baseurl }}"/>
<link rel="stylesheet" href="{{ "/css/style.css" | prepend: site.baseurl }}"/> <link rel="stylesheet" href="{{ "/css/style.css" | prepend: site.baseurl }}"/>
<link rel="stylesheet" href="{{ "/css/responsive.css" | prepend: site.baseurl }}"/> <link rel="stylesheet" href="{{ "/css/responsive.css" | prepend: site.baseurl }}"/>
<script src="{{ "/js/lazyload.min.js" | prepend: site.baseurl }}"></script>
<script src="{{ "/bower_components/modernizr/modernizr.js" | prepend: site.baseurl }}"></script> <script src="{{ "/bower_components/modernizr/modernizr.js" | prepend: site.baseurl }}"></script>
<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}"> <link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">

2
_includes/header-404.html

@ -3,7 +3,7 @@
<ul class='title-area'> <ul class='title-area'>
<li class=""> <li class="">
<h1> <h1>
<a href='{{site.baseurl}}/'><img class="lazy" data-src="{{site.basurl}}/images/main/logo.svg" width="180.7px" height="56.5px" alt="Ura Logo"> <a href='{{site.baseurl}}/'><img src="{{site.basurl}}/images/main/logo.svg" width="180.7px" height="56.5px" alt="Ura Logo">
</a> </a>
</h1> </h1>
</li> </li>

2
_includes/header-post.html

@ -3,7 +3,7 @@
<ul class='title-area'> <ul class='title-area'>
<li class=""> <li class="">
<h1> <h1>
<a href='{{site.baseurl}}/'><img class="lazy" data-src="/images/main/logo.svg" width="180.7px" height="56.5px alt="Ura Logo"> <a href='{{site.baseurl}}/'><img src="/images/main/logo.svg" width="180.7px" height="56.5px alt="Ura Logo">
</a> </a>
</h1> </h1>
</li> </li>

2
_layouts/default-post.html

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en-US"> <html>
{% include head.html %} {% include head.html %}

4
_layouts/default.html

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en-US"> <html>
{% include head.html %} {% include head.html %}
@ -12,7 +12,7 @@
<div id="cookieConsent" style="display: none;"> <div id="cookieConsent" style="display: none;">
<div id="closeCookieConsent">x</div> <div id="closeCookieConsent">x</div>
This website is using cookies. <a href="/privacy-policy" target="_blank" rel="noopener">More info</a>. <a class="cookieConsentOK">That's Fine</a> This website is using cookies. <a href="/privacy-policy" target="_blank">More info</a>. <a class="cookieConsentOK">That's Fine</a>
</div> </div>
{% include footer.html %} {% include footer.html %}

2
_layouts/post.html

@ -21,7 +21,7 @@ section_id: blog
</span> </span>
/ /
{% endif %} {% endif %}
<span>{{page.date | date: "%B %d, %Y" }}</span> by <a href="{{page.link}}" target="_blank" rel="noopener">{{page.author}}</a> <span>{{page.date | date: "%B %d, %Y" }}</span> by <a href="{{page.link}}" target="_blank">{{page.author}}</a>
</p> </p>
{{content}} {{content}}
</div> </div>

12
_posts/2017-01-24-wikispeech-wikimedia-project-has-a-logo-guess-who-designed-it.md

@ -7,6 +7,8 @@ date: 2017-01-24 12:00:00 +0200
categories: categories:
images: images:
- images/blog/ura-wikispeech.png - images/blog/ura-wikispeech.png
header:
- images/blog/ura-wikispeech.png
tags: tags:
- Wikimedia - Wikimedia
- Wikispeech - Wikispeech
@ -16,19 +18,19 @@ excerpt:
At Ura we <3 Wikipedia and other projects empowered by the Wikimedia Foundation such as Wikidata, Commons and Wikivoyage to mention a few. Actually, the organization has initiated and manages amazing projects in the filed of open knowledge and open source software, which labels it to our conscience as one of the most important pillars [] At Ura we <3 Wikipedia and other projects empowered by the Wikimedia Foundation such as Wikidata, Commons and Wikivoyage to mention a few. Actually, the organization has initiated and manages amazing projects in the filed of open knowledge and open source software, which labels it to our conscience as one of the most important pillars []
--- ---
At Ura we <3 Wikipedia and other projects empowered by the <a href="https://www.wikimedia.org/" target="blank" rel="noopener">Wikimedia Foundation</a> such as <a href="https://www.wikidata.org/wiki/Wikidata:Main_Page" target="blank" rel="noopener">Wikidata</a>, <a href="https://commons.wikimedia.org/wiki/Main_Page" target="blank">Commons</a> and <a href="https://www.wikivoyage.org/" target="blank" rel="noopener">Wikivoyage</a> to mention a few. Actually, the organization has initiated and manages amazing projects in the filed of open knowledge and open source software, which labels it to our conscience as one of the most important pillars of floss and open data culture. The latest addition to the list of the projects we really like, Wikimedia recently announced <a href="https://www.mediawiki.org/wiki/Wikispeech" target="blank" rel="noopener">Wikispeech</a>, a text-to-speech tool with a focus on accessibility. At Ura we <3 Wikipedia and other projects empowered by the <a href="https://www.wikimedia.org/" target="blank">Wikimedia Foundation</a> such as <a href="https://www.wikidata.org/wiki/Wikidata:Main_Page" target="blank">Wikidata</a>, <a href="https://commons.wikimedia.org/wiki/Main_Page" target="blank">Commons</a> and <a href="https://www.wikivoyage.org/" target="blank">Wikivoyage</a> to mention a few. Actually, the organization has initiated and manages amazing projects in the filed of open knowledge and open source software, which labels it to our conscience as one of the most important pillars of floss and open data culture. The latest addition to the list of the projects we really like, Wikimedia recently announced <a href="https://www.mediawiki.org/wiki/Wikispeech" target="blank">Wikispeech</a>, a text-to-speech tool with a focus on accessibility.
> "The Wikispeech project aims to create an open source text-to-speech tool to make Wikimedia’s projects more accessible for people that have difficulties reading for different reasons. Wikispeech will be available as a MediaWiki extension. It will be a server based solution, which means that it can be used without having to install any software locally (something that is not possible on all devices used to access the Internet). All components will be open source and all data and documentation will be under a free license so that it can also be included on other platforms. The development of a text-to-speech extension for MediaWiki has been carefully investigated and planed during a pilot study in Autumn 2015.' Read the full blog post and the announcement <a href="https://blog.wikimedia.org/2016/12/20/wikispeech/" target="blank" rel="noopener">here</a> > "The Wikispeech project aims to create an open source text-to-speech tool to make Wikimedia’s projects more accessible for people that have difficulties reading for different reasons. Wikispeech will be available as a MediaWiki extension. It will be a server based solution, which means that it can be used without having to install any software locally (something that is not possible on all devices used to access the Internet). All components will be open source and all data and documentation will be under a free license so that it can also be included on other platforms. The development of a text-to-speech extension for MediaWiki has been carefully investigated and planed during a pilot study in Autumn 2015.' Read the full blog post and the announcement <a href="https://blog.wikimedia.org/2016/12/20/wikispeech/" target="blank">here</a>
<p>Being a non for profit Wikimedia has limited funds for many of its activities including design for some of the projects. That’s why a <a href="https://www.mediawiki.org/wiki/Wikispeech/Logo" target="blank" rel="noopener">logo design competition</a> for the project was announced some months ago. Knowing the importance of the design in such an innovative project, but also having financial support from our <a href="https://www.patreon.com/ura" target="blank" rel="noopener">amazing supporters of the Patreon campaign</a>, we worked and sent on different proposals and after a public discussion one of our proposal was chosen as the official logo of the initiative. <p>Being a non for profit Wikimedia has limited funds for many of its activities including design for some of the projects. That’s why a <a href="https://www.mediawiki.org/wiki/Wikispeech/Logo" target="blank">logo design competition</a> for the project was announced some months ago. Knowing the importance of the design in such an innovative project, but also having financial support from our <a href="https://www.patreon.com/ura" target="blank">amazing supporters of the Patreon campaign</a>, we worked and sent on different proposals and after a public discussion one of our proposal was chosen as the official logo of the initiative.
The logo incorporates the look and feel of the main Wikimedia projects and also the color palette used by these projects. At the same time it features elements related to audio in order to make it easily recognizable as a project related to a text-to-speech system.</p> The logo incorporates the look and feel of the main Wikimedia projects and also the color palette used by these projects. At the same time it features elements related to audio in order to make it easily recognizable as a project related to a text-to-speech system.</p>
<div class="large-12 large-centered centered-text columns"> <div class="large-12 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/wikispeech.png" alt="wikispeech logo"> <img src="/images/blog/wikispeech.png" alt="wikispeech logo">
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<p>Some of us contribute to Wikipedia with article creation and editing, but also though the organization of events at hackerspaces and universities with the ultimate goal of engaging more and more people. We, the contributors of the open source culture and community members, have to understand that good design is essential to communicate quickly, easily and universally the main elements of these projects to everyone that has the potential to join our movement.</p> <p>Some of us contribute to Wikipedia with article creation and editing, but also though the organization of events at hackerspaces and universities with the ultimate goal of engaging more and more people. We, the contributors of the open source culture and community members, have to understand that good design is essential to communicate quickly, easily and universally the main elements of these projects to everyone that has the potential to join our movement.</p>
<p>We can only achieve this goal only if teams like ours here at Ura dedicate more and more time to make better design for open knowledge initiatives such as Wikispeech. That’s why we ask your support from people like you though our Patreon campaign. More support from you means directly better design, and better design means more engaged and bigger floss communities. <p>We can only achieve this goal only if teams like ours here at Ura dedicate more and more time to make better design for open knowledge initiatives such as Wikispeech. That’s why we ask your support from people like you though our Patreon campaign. More support from you means directly better design, and better design means more engaged and bigger floss communities.
Help us hep floss initiatives communicate better with their audiences through open source design: <a href="https://www.patreon.com/ura" target="blank" rel="noopener">https://www.patreon.com/ura!</a></p> Help us hep floss initiatives communicate better with their audiences through open source design: <a href="https://www.patreon.com/ura" target="blank">https://www.patreon.com/ura!</a></p>

20
_posts/2017-02-11-open-source-design-workshop-open-labs-hackerspace-tirana.md

@ -7,6 +7,8 @@ date: 2017-02-11 12:00:00 +0200
categories: categories:
images: images:
- images/blog/osd_event.png - images/blog/osd_event.png
header:
- images/blog/workshop-1.jpg
tags: tags:
- Open Source Design - Open Source Design
- Workshop - Workshop
@ -15,10 +17,10 @@ excerpt:
When we started our Patreon campaign we had a simple vision; to use the financial resources of our supporters to provide better design to free open source and open web initiatives that we think are important to communicate better with the outside world through better design. In the first days we thought that this was […] When we started our Patreon campaign we had a simple vision; to use the financial resources of our supporters to provide better design to free open source and open web initiatives that we think are important to communicate better with the outside world through better design. In the first days we thought that this was […]
--- ---
<p>When we started our <a href="https://www.patreon.com/ura" target="blank" rel="noopener">Patreon campaign</a> we had a simple vision: to use the financial resources of our supporters to provide better design to free open source and open web initiatives that we think are important to communicate better with the outside world through better design. In the first days we thought that this was enough to change the quality of visual communication. This perception changed gradually after discussions with graphic designers that are doing their first step in this field. We quickly understood that they have many questions about the usage of free open source tools in the process of designing for their needs.<br /> With this in mind it was clear that that we definitely need to educate the new generation of designers through workshops and talks about our philosophy. Without further delay we started organizing the first Open Source Design workshop at <a href="https://openlabs.cc/" target="blank" rel="noopener">Open Labs hackerspace in Tirana</a>, home of the open source community in Albania.</p> <p>When we started our <a href="https://www.patreon.com/ura" target="blank">Patreon campaign</a> we had a simple vision: to use the financial resources of our supporters to provide better design to free open source and open web initiatives that we think are important to communicate better with the outside world through better design. In the first days we thought that this was enough to change the quality of visual communication. This perception changed gradually after discussions with graphic designers that are doing their first step in this field. We quickly understood that they have many questions about the usage of free open source tools in the process of designing for their needs.<br /> With this in mind it was clear that that we definitely need to educate the new generation of designers through workshops and talks about our philosophy. Without further delay we started organizing the first Open Source Design workshop at <a href="https://openlabs.cc/" target="blank">Open Labs hackerspace in Tirana</a>, home of the open source community in Albania.</p>
<div class="large-12 large-centered centered-text columns"> <div class="large-12 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/workshop-1.jpg" alt="workshop"> <img src="/images/blog/workshop-1.jpg" alt="workshop">
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
@ -33,30 +35,30 @@ During the presentation the participants had the opportunity to:
</p> </p>
<div class="large-12 large-centered centered-text columns"> <div class="large-12 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/workshop-2.jpg" alt="workshop"> <img src="/images/blog/workshop-2.jpg" alt="workshop">
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<p>In conclusion: it was a great first step in educating the next generation of visual designers about the values designing in the open. We definitely need more of your <a href="https://www.patreon.com/ura" target="blank" rel="noopener">support though Patreon</a> to host even more workshops not only in Albania, but also other countries.<br /> Interested in the next events? Visit <a href="/events" target="blank">this dedicated page</a> from time to time, or follow us on Twitter. <p>In conclusion: it was a great first step in educating the next generation of visual designers about the values designing in the open. We definitely need more of your <a href="https://www.patreon.com/ura" target="blank">support though Patreon</a> to host even more workshops not only in Albania, but also other countries.<br /> Interested in the next events? Visit <a href="/events" target="blank">this dedicated page</a> from time to time, or follow us on Twitter.
<div class="large-12 large-centered centered-text columns"> <div class="large-12 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/workshop-3.jpg" alt="workshop"> <img src="/images/blog/workshop-3.jpg" alt="workshop">
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<div class="large-12 large-centered centered-text columns"> <div class="large-12 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/workshop-4.jpg" alt="workshop"> <img src="/images/blog/workshop-4.jpg" alt="workshop">
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<div class="large-12 large-centered centered-text columns"> <div class="large-12 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/workshop-5.jpg" alt="workshop"> <img src="/images/blog/workshop-5.jpg" alt="workshop">
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<div class="large-12 large-centered centered-text columns"> <div class="large-12 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/workshop-7.jpg" alt="workshop"> <img src="/images/blog/workshop-7.jpg" alt="workshop">
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<i>Photos: <a href="http://andisrado.com" target="blank" rel="noopener">Andis Rado</a>, (Creative Commons – Attribution-ShareAlike 4.0 International)</i> <i>Photos: <a href="http://andisrado.com" target="blank">Andis Rado</a>, (Creative Commons – Attribution-ShareAlike 4.0 International)</i>

20
_posts/2017-08-25-ura-sha-2017.md

@ -7,6 +7,8 @@ date: 2017-08-25 12:00:00 +0200
categories: categories:
images: images:
- images/blog/sha1-thumb.jpg - images/blog/sha1-thumb.jpg
header:
- images/blog/sha1.jpg
tags: tags:
- Still Hacking Anyway - Still Hacking Anyway
- SHA2017 - SHA2017
@ -14,13 +16,13 @@ excerpt:
Two weeks ago we had Silva Arapi to join our team as our new communications manager. Silva has been a member of Open Labs Hackerspace in Tirana for the last two years and she has been contributing for different open source projects, so we were pleased to welcome on board someone who knows and believes […] Two weeks ago we had Silva Arapi to join our team as our new communications manager. Silva has been a member of Open Labs Hackerspace in Tirana for the last two years and she has been contributing for different open source projects, so we were pleased to welcome on board someone who knows and believes […]
--- ---
<p>Two weeks ago we had <a href="https://silva.arapi.tech/" target="blank" rel="noopener">Silva Arapi</a> to join our team as our new communications manager. Silva has been a member of <a href="https://openlabs.cc/en" target="blank" rel="noopener">Open Labs Hackerspace</a> in Tirana for the last two years and she has been contributing for different open source projects, so we were pleased to welcome on board someone who knows and believes in the open source ethics.</p> <p>Two weeks ago we had <a href="https://silva.arapi.tech/" target="blank">Silva Arapi</a> to join our team as our new communications manager. Silva has been a member of <a href="https://openlabs.cc/en" target="blank">Open Labs Hackerspace</a> in Tirana for the last two years and she has been contributing for different open source projects, so we were pleased to welcome on board someone who knows and believes in the open source ethics.</p>
<p>Since she was going to attend the <a href="https://sha2017.org/" target="blank" rel="noopener">SHA2017</a> Hacker Camp in the Netherlands, this was a great opportunity for her to also meet people from the <a href="http://opensourcedesign.net/" target="blank" rel="noopener">Open Source Design</a> community and people from other open source projects we’ve been working with.<br /> <p>Since she was going to attend the <a href="https://sha2017.org/" target="blank">SHA2017</a> Hacker Camp in the Netherlands, this was a great opportunity for her to also meet people from the <a href="http://opensourcedesign.net/" target="blank">Open Source Design</a> community and people from other open source projects we’ve been working with.<br />
For those of you who haven’t heard of SHA before: this is an outdoor hacker camp which took place in the Netherlands on August 4th to 8th and was the successor of similar events which have been taking place every 4 years and thousands of visitors have been joining it. Thousands of activists,free-thinkers, hackers, geeks, scientists, makers and others from all over the world joined SHA2017 to share their ideas, thoughts and knowledge, to discuss, build and hack with others.</p> For those of you who haven’t heard of SHA before: this is an outdoor hacker camp which took place in the Netherlands on August 4th to 8th and was the successor of similar events which have been taking place every 4 years and thousands of visitors have been joining it. Thousands of activists,free-thinkers, hackers, geeks, scientists, makers and others from all over the world joined SHA2017 to share their ideas, thoughts and knowledge, to discuss, build and hack with others.</p>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/tower.jpg" alt="tower at SHA2017"><br /> <img src="/images/blog/tower.jpg" alt="tower at SHA2017"><br />
<i>By Erik Albers (Own work) [CC0], via Wikimedia Commons</i> <i>By Erik Albers (Own work) [CC0], via Wikimedia Commons</i>
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
@ -28,26 +30,26 @@ For those of you who haven’t heard of SHA before: this is an outdoor hacker ca
<p>One of the things that Silva noticed during these hacking days was the fact that people were not talking so much about design in general, which is not that much of a surprise since the event is quite technical in general. But of course, there were so many people there and she also had the chance to meet some of those who were also concerned about the design of their products and would like to meet and talk to people who are experts of the field, and having projects like Open Source Design makes it easer to show them a place were they should go and ask for advice or help.</p> <p>One of the things that Silva noticed during these hacking days was the fact that people were not talking so much about design in general, which is not that much of a surprise since the event is quite technical in general. But of course, there were so many people there and she also had the chance to meet some of those who were also concerned about the design of their products and would like to meet and talk to people who are experts of the field, and having projects like Open Source Design makes it easer to show them a place were they should go and ask for advice or help.</p>
> Still Open Source Designing Anyway!! #sha2017 #sha2017camp @SHA2017Badge <a href="https://pic.twitter.com/rmejAIL1YM" target="blank" rel="noopener">pic.twitter.com/rmejAIL1YM</a> > Still Open Source Designing Anyway!! #sha2017 #sha2017camp @SHA2017Badge <a href="https://pic.twitter.com/rmejAIL1YM" target="blank">pic.twitter.com/rmejAIL1YM</a>
— Ura Design (@uracreative) August 7, 2017 — Ura Design (@uracreative) August 7, 2017
<p>During her days at the camp Silva had the chance to meet <a href="https://twitter.com/seoul_victoria" target="blank" rel="noopener">Victoria</a>, a UX Researcher/Designer who is part of the Open Source Design community. Victoria told her a bit more about the the community, what the people who are part of it have been working on and what are some of their future plans. She also met <a href="https://www.linkedin.com/in/hpbos" target="blank" rel="noopener">Herman</a> one of our clients who is the founder of <a href="https://www.osso.nl/" target="blank" rel="noopener">OSSO</a>, a company which specializes in open source infrastructure, development and operations. We have been working with them during the last months to improve the design for some of their products.</p> <p>During her days at the camp Silva had the chance to meet <a href="https://twitter.com/seoul_victoria" target="blank">Victoria</a>, a UX Researcher/Designer who is part of the Open Source Design community. Victoria told her a bit more about the the community, what the people who are part of it have been working on and what are some of their future plans. She also met <a href="https://www.linkedin.com/in/hpbos" target="blank">Herman</a> one of our clients who is the founder of <a href="https://www.osso.nl/" target="blank">OSSO</a>, a company which specializes in open source infrastructure, development and operations. We have been working with them during the last months to improve the design for some of their products.</p>
<p>The camping days were intensive, with so many great talks, workshops and hacking sessions. Silva says that having more presence in such events by people who work with design would help in increasing awareness about the importance of good design while building technological products.</p> <p>The camping days were intensive, with so many great talks, workshops and hacking sessions. Silva says that having more presence in such events by people who work with design would help in increasing awareness about the importance of good design while building technological products.</p>
<p>Check <a href="https://silva.arapi.tech/sha-2017-hacker-camp/" target="blank" rel="noopener">her blog</a> for more details on the camp.</p> <p>Check <a href="https://silva.arapi.tech/sha-2017-hacker-camp/" target="blank">her blog</a> for more details on the camp.</p>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/sha1.jpg" alt="SHA2017"><br /> <img src="/images/blog/sha1.jpg" alt="SHA2017"><br />
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/sha2.jpg" alt="SHA2017"><br /> <img src="/images/blog/sha2.jpg" alt="SHA2017"><br />
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/sha3.jpg" alt="SHA2017"><br /> <img src="/images/blog/sha3.jpg" alt="SHA2017"><br />
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>

10
_posts/2018-01-09-ura-work-week-november-2017.md

@ -19,19 +19,19 @@ At Ura we all work from home, so we have our <strong>"Ura work week"</strong> ev
We had our first working week this November where all gathered in the city of Tirana. We would start our meetings in the morning, usually by having breakfast and some coffee first and then start working accordingly with our pre-made agenda.</p> We had our first working week this November where all gathered in the city of Tirana. We would start our meetings in the morning, usually by having breakfast and some coffee first and then start working accordingly with our pre-made agenda.</p>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/work-week.jpg" alt="Ura Team at Code Week"><br /> <img src="/images/blog/work-week.jpg" alt="Ura Team at Code Week"><br />
<i>The Ura Team</i> <i>The Ura Team</i>
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<p>The first day started with some photoshooting for the whole team which was quite a fun experience, and everyone had an updated profile within the day in all the platforms we use for our daily work. We spent the first day mostly by going back to what we had been doing so far, what had gone good and what could have been done better. As everyone shared their thoughts, we started planning what our next steps would be. While going through this process, feeling confident about we had achieved and also a bit challenged for what’s going to be next, we were all very optimistic and motivated to keep doing our work and find ways to be more creative. We had already been searching for an alternative which would help us to better organize our work and while looking for the different options, we decided to proceed with <a href="https://github.com/uracreative" target="blank" rel="noopener">GitHub</a> as a task manager and have our whole working process fully in the open.</p> <p>The first day started with some photoshooting for the whole team which was quite a fun experience, and everyone had an updated profile within the day in all the platforms we use for our daily work. We spent the first day mostly by going back to what we had been doing so far, what had gone good and what could have been done better. As everyone shared their thoughts, we started planning what our next steps would be. While going through this process, feeling confident about we had achieved and also a bit challenged for what’s going to be next, we were all very optimistic and motivated to keep doing our work and find ways to be more creative. We had already been searching for an alternative which would help us to better organize our work and while looking for the different options, we decided to proceed with <a href="https://github.com/uracreative" target="blank">GitHub</a> as a task manager and have our whole working process fully in the open.</p>
<p>Being a new company that promotes openness and believes in open source values, we wanted to be fully open too, about the way how we operate, how we work with our clients, how we get resources and support from different organizations and the future projects we plan to be part of. We believe that by working in the open, we are part of a more productive and transparent process especially because we have constantly been getting support from people and organizations, some through our <a href="https://www.patreon.com/ura" target="blank" rel="noopener">Patreon donators</a> but also from other sponsors and supporters. We also believe that in this way we can also get feedback from other professionals in the field and this can help us improve our work daily. Just as it happens with other open source projects, we give something and get something else back. This is our <a href="https://github.com/uracreative/task-management" target="blank" rel="noopener">repository</a> for our tasks management which you can feel free to take a look at and share your opinions and thoughts with us if there is any topic you are interested at or related to.</p> <p>Being a new company that promotes openness and believes in open source values, we wanted to be fully open too, about the way how we operate, how we work with our clients, how we get resources and support from different organizations and the future projects we plan to be part of. We believe that by working in the open, we are part of a more productive and transparent process especially because we have constantly been getting support from people and organizations, some through our <a href="https://www.patreon.com/ura" target="blank">Patreon donators</a> but also from other sponsors and supporters. We also believe that in this way we can also get feedback from other professionals in the field and this can help us improve our work daily. Just as it happens with other open source projects, we give something and get something else back. This is our <a href="https://github.com/uracreative/task-management" target="blank">repository</a> for our tasks management which you can feel free to take a look at and share your opinions and thoughts with us if there is any topic you are interested at or related to.</p>
<p>We also decided to switch to <a href="https://about.mattermost.com/" target="blank" rel="noopener">Mattermost</a> as a tool to communicate. As we always try to find open source solutions for every choice of platform we make, Mattermost as an open source, self-hosted approach resulted as one of the best options for us since it offers more control and privacy, which we all value so much.</p> <p>We also decided to switch to <a href="https://about.mattermost.com/" target="blank">Mattermost</a> as a tool to communicate. As we always try to find open source solutions for every choice of platform we make, Mattermost as an open source, self-hosted approach resulted as one of the best options for us since it offers more control and privacy, which we all value so much.</p>
<p>Of course, there were many other side activities during Work Week. We all went at the cinema together, had dinner and drinks and a great time as well.</p> <p>Of course, there were many other side activities during Work Week. We all went at the cinema together, had dinner and drinks and a great time as well.</p>
<p>So, now what?</p> <p>So, now what?</p>
<p>We plan to collaborate and work this way now on, share our knowledge with other people and keep spreading the open source love. More efforts now will go for our brand new product, <a href="http://identihub.co/" target="blank" rel="noopener">Identihub</a>, an open source and self-hosted software to manage and share your brand and visual assets which is keeping all the team very enthusiastic for what’s to come.</p> <p>We plan to collaborate and work this way now on, share our knowledge with other people and keep spreading the open source love. More efforts now will go for our brand new product, <a href="http://identihub.co/" target="blank">Identihub</a>, an open source and self-hosted software to manage and share your brand and visual assets which is keeping all the team very enthusiastic for what’s to come.</p>

10
_posts/2018-01-15-chaos-communication-congress-2017.md

@ -7,6 +7,8 @@ date: 2018-01-15 12:00:00 +0200
categories: categories:
images: images:
- images/blog/34c3_thumb.png - images/blog/34c3_thumb.png
header:
- images/blog/elio-ccc.png
tags: tags:
- Chaos Communication Congress - Chaos Communication Congress
- CCC - CCC
@ -15,19 +17,19 @@ excerpt:
Chaos Communication Congress or simply CCC , is a four-day conference focusing on technology and social issues of our times. The organizers, the Chaos Computer Club, try to bring up to the spotlight privacy issues and the importance of the human rights on the digital world we “breathe” every day. Through workshops and presentations the […] Chaos Communication Congress or simply CCC , is a four-day conference focusing on technology and social issues of our times. The organizers, the Chaos Computer Club, try to bring up to the spotlight privacy issues and the importance of the human rights on the digital world we “breathe” every day. Through workshops and presentations the […]
--- ---
<p><a href="https://events.ccc.de/congress/2017/wiki/index.php/Main_Page" target="blank" rel="noopener">Chaos Communication Congress</a> or simply CCC , is a four-day conference focusing on technology and social issues of our times. The organizers, the Chaos Computer Club, try to bring up to the spotlight privacy issues and the importance of the human rights on the digital world we “breathe” every day. Through workshops and presentations the attendees have the chance to get updated on how the unethical use of the digital resources that we have on our disposal can harm or transform our society.</p> <p><a href="https://events.ccc.de/congress/2017/wiki/index.php/Main_Page" target="blank">Chaos Communication Congress</a> or simply CCC , is a four-day conference focusing on technology and social issues of our times. The organizers, the Chaos Computer Club, try to bring up to the spotlight privacy issues and the importance of the human rights on the digital world we “breathe” every day. Through workshops and presentations the attendees have the chance to get updated on how the unethical use of the digital resources that we have on our disposal can harm or transform our society.</p>
<p>Our team, as a collective of creative individuals dedicated to work in the open, couldn’t miss the chance to be there. We share the same values with CCC when it comes to the use of free and open source tools for our work and that’s why Elio, one of our team members and the founder of Ura, was there on the last week of December to present at the FSFS assembly track.</p> <p>Our team, as a collective of creative individuals dedicated to work in the open, couldn’t miss the chance to be there. We share the same values with CCC when it comes to the use of free and open source tools for our work and that’s why Elio, one of our team members and the founder of Ura, was there on the last week of December to present at the FSFS assembly track.</p>
<div class="large-12 large-centered centered-text columns"> <div class="large-12 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/elio-ccc.png" alt="34C3"><br /> <img src="/images/blog/elio-ccc.png" alt="34C3"><br />
<i>During the Identihub presentation</i> <i>During the Identihub presentation</i>
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<p>The major focus of his talk was the introduction of the attendees to our creative process, the way we operate, our works with our clients so far and our latest product <a href="https://identihub.co/" target="blank" rel="noopener">Identihub</a>, the open source hosting platform for brand and visual asset management. A special part of the talk was to explain why we choose to work with open source tools and why we decided to go fully open by having a task manager on Github, which means that everyone has the chance to see our progress as weeks go by and why we support other open source initiatives out there. Of course, working in the open means that even more fellow hacktivists can contribute in every operational process of Ura, which is something we aim to grow even more in the next months.</p> <p>The major focus of his talk was the introduction of the attendees to our creative process, the way we operate, our works with our clients so far and our latest product <a href="https://identihub.co/" target="blank">Identihub</a>, the open source hosting platform for brand and visual asset management. A special part of the talk was to explain why we choose to work with open source tools and why we decided to go fully open by having a task manager on Github, which means that everyone has the chance to see our progress as weeks go by and why we support other open source initiatives out there. Of course, working in the open means that even more fellow hacktivists can contribute in every operational process of Ura, which is something we aim to grow even more in the next months.</p>
<p>As the new open source kid on the block, Identihub was on the primary focus of this lecture. The software and its features were presented to the participants of the assembly and explained capabilities, the license and the need of free open source organizations to improve their visual representation. At the end, our teammate explained how everyone can contribute and support this initiative, either by contributing on <a href="https://github.com/uracreative/" target="blank" rel="noopener">GitHub</a> or supporting us financially on a monthly basis by signing up at our dedicated <a href="https://www.patreon.com/ura" target="blank" rel="noopener">Patreon</a> page. Most important, our participation at 34C3 resulted in using Identihub to host the visual identity of the conference.</p> <p>As the new open source kid on the block, Identihub was on the primary focus of this lecture. The software and its features were presented to the participants of the assembly and explained capabilities, the license and the need of free open source organizations to improve their visual representation. At the end, our teammate explained how everyone can contribute and support this initiative, either by contributing on <a href="https://github.com/uracreative/" target="blank">GitHub</a> or supporting us financially on a monthly basis by signing up at our dedicated <a href="https://www.patreon.com/ura" target="blank">Patreon</a> page. Most important, our participation at 34C3 resulted in using Identihub to host the visual identity of the conference.</p>
<p>Of course, from an event of this kind we couldn’t miss sharing some swag. We had our stickers and 3D-printed logos distributed to the participants of the Congress.</p> <p>Of course, from an event of this kind we couldn’t miss sharing some swag. We had our stickers and 3D-printed logos distributed to the participants of the Congress.</p>

14
_posts/2018-02-09-ura-fosdem-2018.md

@ -7,6 +7,8 @@ date: 2018-02-09 12:00:00 +0200
categories: categories:
images: images:
- images/blog/Elio-FOSDEM2018-thumb.jpg - images/blog/Elio-FOSDEM2018-thumb.jpg
header:
- images/blog/Elio-FOSDEM2018.jpg
tags: tags:
- FOSDEM - FOSDEM
- FOSDEM2018 - FOSDEM2018
@ -16,30 +18,30 @@ excerpt:
During last weekend the Ura team traveled to Brussels, Belgium to attend FOSDEM. We had the chance to be present at one of the largest conferences in Europe (and probably the largest Free Software/ Open Source one). Just like at CCC, we strive to be at events which promote collaborative projects and initiatives. In addition […] During last weekend the Ura team traveled to Brussels, Belgium to attend FOSDEM. We had the chance to be present at one of the largest conferences in Europe (and probably the largest Free Software/ Open Source one). Just like at CCC, we strive to be at events which promote collaborative projects and initiatives. In addition […]
--- ---
<p>During last weekend the Ura team traveled to Brussels, Belgium to attend <a href="https://fosdem.org/2018/" target="_blank" rel="noopener">FOSDEM</a>. We had the chance to be present at one of the largest conferences in Europe (and probably the largest Free Software/ Open Source one). Just like at <a href="https://dev.ura.design/blogposts/2018/01/15/chaos-communication-congress-2017.html" target="_blank" rel="noopener">CCC</a>, we strive to be at events which promote collaborative projects and initiatives. In addition to that, three members of the team were there as Mozilla Tech Speakers. It can be said that many of us wear various hats at the same time.</p> <p>During last weekend the Ura team traveled to Brussels, Belgium to attend <a href="https://fosdem.org/2018/" target="_blank">FOSDEM</a>. We had the chance to be present at one of the largest conferences in Europe (and probably the largest Free Software/ Open Source one). Just like at <a href="https://dev.ura.design/blogposts/2018/01/15/chaos-communication-congress-2017.html" target="_blank">CCC</a>, we strive to be at events which promote collaborative projects and initiatives. In addition to that, three members of the team were there as Mozilla Tech Speakers. It can be said that many of us wear various hats at the same time.</p>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/OSD.jpg" alt="OSD booth at FOSDEM"><br /> <img src="/images/blog/OSD.jpg" alt="OSD booth at FOSDEM"><br />
<i>Open Source Design infobooth – By Mariana Balla (Creative Commons – Attribution-ShareAlike 4.0 International)</i> <i>Open Source Design infobooth – By Mariana Balla (Creative Commons – Attribution-ShareAlike 4.0 International)</i>
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<p>As part of the <a href="http://opensourcedesign.net/" target="_blank" rel="noopener">Open Source Design community</a>, you could find us at the respective infobooth on both days. Members of our team were at the both along with other fellow designers. Together, we emphasized the importance of usability and user centered design in Open Source Projects. At the “Design Clinic” session, attendees could come to us and showcase us their project. By doing so, designers could advise them on the improvements their design would benefit from.</p> <p>As part of the <a href="http://opensourcedesign.net/" target="_blank">Open Source Design community</a>, you could find us at the respective infobooth on both days. Members of our team were at the both along with other fellow designers. Together, we emphasized the importance of usability and user centered design in Open Source Projects. At the “Design Clinic” session, attendees could come to us and showcase us their project. By doing so, designers could advise them on the improvements their design would benefit from.</p>
<p>At the Open Source Design booth, apart talking about our Design philosophy, we also had the chance to tell people about the way we operate and why we are focused on Free and Open Source Software, We were also happy to introduce “Logobridge” our side-project which helps us contribute back to the community as a whole.</p> <p>At the Open Source Design booth, apart talking about our Design philosophy, we also had the chance to tell people about the way we operate and why we are focused on Free and Open Source Software, We were also happy to introduce “Logobridge” our side-project which helps us contribute back to the community as a whole.</p>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/Elio-FOSDEM2018.jpg" alt="Elio during his presentation at FOSDEM 2018"><br /> <img src="/images/blog/Elio-FOSDEM2018.jpg" alt="Elio during his presentation at FOSDEM 2018"><br />
<i>During the presentation – By Mariana Balla (Creative Commons – Attribution-ShareAlike 4.0 International)</i> <i>During the presentation – By Mariana Balla (Creative Commons – Attribution-ShareAlike 4.0 International)</i>
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<p>On the 2nd day, Elio, the founder of Ura presented <a href="https://identihub.co/" target="_blank" rel="noopener">Identihub</a>. He presented a live <a href="https://demo.identihub.co/" target="_blank" rel="noopener">demo</a> of the latest version we are launching. During his presentation all attendees had the chance to watch in real time how they could host their visual assets and how to use some of its features, like format conversion of a certain file. Elio emphasized the importance of SVG as the “middleman” between developers and designers and how exciting it can be if in the future we would be able to have a similar version control powered by Git which would be tailored for designers and developers alike.</p> <p>On the 2nd day, Elio, the founder of Ura presented <a href="https://identihub.co/" target="_blank">Identihub</a>. He presented a live <a href="https://demo.identihub.co/" target="_blank">demo</a> of the latest version we are launching. During his presentation all attendees had the chance to watch in real time how they could host their visual assets and how to use some of its features, like format conversion of a certain file. Elio emphasized the importance of SVG as the “middleman” between developers and designers and how exciting it can be if in the future we would be able to have a similar version control powered by Git which would be tailored for designers and developers alike.</p>
<p>Further the attendees were introduced to more technical details of the project. Identihub development and discussion happen on GitHub and contributions from everyone are welcomed. Having said that, everyone who is willing to contribute to the project can do so by either contributing with patches, reporting bugs, suggesting usability improvements or creating mockups. Last but not least you can support the Identihub development financially by signing up for a monthly contribution at our dedicated Patreon.</p> <p>Further the attendees were introduced to more technical details of the project. Identihub development and discussion happen on GitHub and contributions from everyone are welcomed. Having said that, everyone who is willing to contribute to the project can do so by either contributing with patches, reporting bugs, suggesting usability improvements or creating mockups. Last but not least you can support the Identihub development financially by signing up for a monthly contribution at our dedicated Patreon.</p>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/Elio-Identihub.jpg" alt="Elio during his presentation about Identihub"><br /> <img src="/images/blog/Elio-Identihub.jpg" alt="Elio during his presentation about Identihub"><br />
<i>During the presentation – By Mariana Balla (Creative Commons – Attribution-ShareAlike 4.0 International)</i> <i>During the presentation – By Mariana Balla (Creative Commons – Attribution-ShareAlike 4.0 International)</i>
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>

20
_posts/2018-02-23-inkscape-workshop-tirana.md

@ -7,6 +7,8 @@ date: 2018-02-23 12:00:00 +0200
categories: categories:
images: images:
- images/blog/Inkscape-Workshop-1-thumb.jpg - images/blog/Inkscape-Workshop-1-thumb.jpg
header:
- images/blog/Inkscape-Workshop-1.jpg
tags: tags:
- Inkscape - Inkscape
- Open Source Design - Open Source Design
@ -15,42 +17,42 @@ excerpt:
Quite some time has passed since we first got in touch with the Open Source Design community. While being an utopian idea in the beginning, it has become clear to us that bringing Open Source values to Design and vice versa requires more of a culture shift than anything else. Having this mantra in mind, […] Quite some time has passed since we first got in touch with the Open Source Design community. While being an utopian idea in the beginning, it has become clear to us that bringing Open Source values to Design and vice versa requires more of a culture shift than anything else. Having this mantra in mind, […]
--- ---
<p>Quite some time has passed since we first got in touch with the <a href="http://opensourcedesign.net/" target="_blank" rel="noopener">Open Source Design community</a>. While being an utopian idea in the beginning, it has become clear to us that bringing Open Source values to Design and vice versa requires more of a culture shift than anything else. Having this mantra in mind, we tried to apply these principles in all communities we were part of. While Ura has a global audience, we care about our roots as well, which are in Tirana, Albania. We were happy to bring young designers in town more information about Open Source Design and the efforts the community is putting into improving Free Software/ Open Source projects.</p> <p>Quite some time has passed since we first got in touch with the <a href="http://opensourcedesign.net/" target="_blank">Open Source Design community</a>. While being an utopian idea in the beginning, it has become clear to us that bringing Open Source values to Design and vice versa requires more of a culture shift than anything else. Having this mantra in mind, we tried to apply these principles in all communities we were part of. While Ura has a global audience, we care about our roots as well, which are in Tirana, Albania. We were happy to bring young designers in town more information about Open Source Design and the efforts the community is putting into improving Free Software/ Open Source projects.</p>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/Inkscape-Workshop-1.jpg" alt="During the workshop"><br /> <img src="/images/blog/Inkscape-Workshop-1.jpg" alt="During the workshop"><br />
<i>During the workshop</i> <i>During the workshop</i>
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<p>Consequently, we organized another <a href="https://discourse.opensourcedesign.net/t/tirana-albania/573/1" target="_blank" rel="noopener">Design workshop</a> at the local <a href="https://openlabs.cc/en/" target="_blank" rel="noopener">Open Labs Hackerspace</a>, this time with a deep dive into Inkscape. While there have been a few designers who worked with Adobe tools, everyone was new to Inkscape, so we went all the way from explaining basic tools, to designing a poster and making it production ready. The attendees were free to pick a main topic for their poster and design it themselves. Towards the end things were becoming interesting as people debated on colors, typography and other design rules.</p> <p>Consequently, we organized another <a href="https://discourse.opensourcedesign.net/t/tirana-albania/573/1" target="_blank">Design workshop</a> at the local <a href="https://openlabs.cc/en/" target="_blank">Open Labs Hackerspace</a>, this time with a deep dive into Inkscape. While there have been a few designers who worked with Adobe tools, everyone was new to Inkscape, so we went all the way from explaining basic tools, to designing a poster and making it production ready. The attendees were free to pick a main topic for their poster and design it themselves. Towards the end things were becoming interesting as people debated on colors, typography and other design rules.</p>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/Inkscape-Workshop-2.jpg" alt="During the workshop"><br /> <img src="/images/blog/Inkscape-Workshop-2.jpg" alt="During the workshop"><br />
<i>During the workshop</i> <i>During the workshop</i>
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<p>The workshop was great fun and we learnt new things as well! Who said that giving workshops does not teach you something too? We are looking forward to host another workshop soon.</p> <p>The workshop was great fun and we learnt new things as well! Who said that giving workshops does not teach you something too? We are looking forward to host another workshop soon.</p>
<p>[Photos during the event] <a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank" rel="noopener">CC BY SA 4.0</a> Andis Rado</p> <p>[Photos during the event] <a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank">CC BY SA 4.0</a> Andis Rado</p>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/Inkscape-Workshop-3.jpg" alt="During the workshop"><br /> <img src="/images/blog/Inkscape-Workshop-3.jpg" alt="During the workshop"><br />
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/Inkscape-Workshop-4.jpg" alt="During the workshop"><br /> <img src="/images/blog/Inkscape-Workshop-4.jpg" alt="During the workshop"><br />
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/Inkscape-Workshop-5.jpg" alt="During the workshop"><br /> <img src="/images/blog/Inkscape-Workshop-5.jpg" alt="During the workshop"><br />
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/Inkscape-Workshop-6.jpg" alt="During the workshop"><br /> <img src="/images/blog/Inkscape-Workshop-6.jpg" alt="During the workshop"><br />
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>

14
_posts/2018-03-12-ura-now-part-open-tech-funds-usability-lab.md

@ -7,6 +7,8 @@ date: 2018-03-12 12:00:00 +0200
categories: categories:
images: images:
- images/blog/home-banner.jpg - images/blog/home-banner.jpg
header:
- images/blog/home-banner.jpg
tags: tags:
- Open Tech Fund - Open Tech Fund
- Usability - Usability
@ -16,23 +18,23 @@ excerpt:
Starting now, Ura will be providing Usability and Design Services to Internet Freedom projects as part of Open Tech Fund’s Usability Lab. The Usability Lab aims to increase user safety and promote practical internet freedom by working with developers and technologists to improve the usability of open ­source circumvention and digital security […] Starting now, Ura will be providing Usability and Design Services to Internet Freedom projects as part of Open Tech Fund’s Usability Lab. The Usability Lab aims to increase user safety and promote practical internet freedom by working with developers and technologists to improve the usability of open ­source circumvention and digital security […]
--- ---
<p>Starting now, Ura will be providing Usability and Design Services to Internet Freedom projects as part of <a href="https://www.opentech.fund/lab/usability-lab" target="_blank" rel="noopener">Open Tech Fund’s Usability Lab</a>.</p> <p>Starting now, Ura will be providing Usability and Design Services to Internet Freedom projects as part of <a href="https://www.opentech.fund/lab/usability-lab" target="_blank">Open Tech Fund’s Usability Lab</a>.</p>
<div class="large-10 large-centered centered-text columns"> <div class="large-10 large-centered centered-text columns">
<img class="lazy" data-src="/images/blog/OTF.jpg" alt="OTF logo"><br /> <img src="/images/blog/OTF.jpg" alt="OTF logo"><br />
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
<p>The <a href="https://www.opentech.fund/lab/usability-lab" target="_blank" rel="noopener">Usability Lab</a> aims to increase user safety and promote practical internet freedom by working with developers and technologists to improve the usability of open ­source circumvention and digital security tools. There are many open ­source software projects that aim to help people around the world – activists, journalists, and everyday citizens – communicate in privacy and security.<br /> <p>The <a href="https://www.opentech.fund/lab/usability-lab" target="_blank">Usability Lab</a> aims to increase user safety and promote practical internet freedom by working with developers and technologists to improve the usability of open ­source circumvention and digital security tools. There are many open ­source software projects that aim to help people around the world – activists, journalists, and everyday citizens – communicate in privacy and security.<br />
Unfortunately, few of these software­ development teams have the capacity or expertise in-house to make tools that are truly usable. These usability challenges hamper tool adoption, or may cause misunderstandings for users about tool functionalities, and subsequently may give users a false sense of security.</p> Unfortunately, few of these software­ development teams have the capacity or expertise in-house to make tools that are truly usable. These usability challenges hamper tool adoption, or may cause misunderstandings for users about tool functionalities, and subsequently may give users a false sense of security.</p>
<p>To provide the above services, <a href="https://www.opentech.fund/" target="_blank" rel="noopener">Open Tech Fund</a> (OTF) is working together with four different Usability Lab partners (among them also Simply Secure with whom we have collaborated in the past). As Ura we are proud to be involved in the Usability Lab and contribute to the improvement and accessibility of Internet Freedom projects.</p> <p>To provide the above services, <a href="https://www.opentech.fund/" target="_blank">Open Tech Fund</a> (OTF) is working together with four different Usability Lab partners (among them also Simply Secure with whom we have collaborated in the past). As Ura we are proud to be involved in the Usability Lab and contribute to the improvement and accessibility of Internet Freedom projects.</p>
<hr> <hr>
<p><strong>About Open Tech Fund</strong></p> <p><strong>About Open Tech Fund</strong></p>
<p>The <a href="https://www.opentech.fund/" target="_blank" rel="noopener">Open Technology Fund</a> utilizes available funds to support Internet freedom projects that empower world citizens to have access to modern communication channels that are free of restrictions, and allow them to communicate without fear of repressive censorship or surveillance.</p> <p>The <a href="https://www.opentech.fund/" target="_blank">Open Technology Fund</a> utilizes available funds to support Internet freedom projects that empower world citizens to have access to modern communication channels that are free of restrictions, and allow them to communicate without fear of repressive censorship or surveillance.</p>
<hr> <hr>
@ -47,4 +49,4 @@ Unfortunately, few of these software­ development teams have the capacity or ex
<li>Assistance developing secure usable <strong>Style Guides</strong>, which outline user interface and graphical elements, rules and guidelines to ensure a cohesive and consistent user experience across different aspects of a tool.</li> <li>Assistance developing secure usable <strong>Style Guides</strong>, which outline user interface and graphical elements, rules and guidelines to ensure a cohesive and consistent user experience across different aspects of a tool.</li>
</ul> </ul>
<p>If you are interested to request help from the Usability Lab, you can <a href="https://www.opentech.fund/lab/usability-lab" target="_blank" rel="noopener">file a request via OTF</a>.<br />If you are specifically requesting Ura’s services and believe that your project or tool and meets the criteria, you can also contact us directly and we will help you frame a scope of work proposal.</p> <p>If you are interested to request help from the Usability Lab, you can <a href="https://www.opentech.fund/lab/usability-lab" target="_blank">file a request via OTF</a>.<br />If you are specifically requesting Ura’s services and believe that your project or tool and meets the criteria, you can also contact us directly and we will help you frame a scope of work proposal.</p>

2
_posts/2018-03-19-new-ura-website.md

@ -7,6 +7,8 @@ date: 2018-03-19 12:00:00 +0200
categories: categories:
images: images:
- images/blog/website_thumb.jpg - images/blog/website_thumb.jpg
header:
- images/blog/new-website.jpg
tags: tags:
- Website - Website
- GitHub Pages - GitHub Pages

4
_posts/2018-03-31-introducing-cryptopayments-for-our-services.md

@ -7,6 +7,8 @@ date: 2018-03-31 12:00:00 +0200
categories: categories:
images: images:
- images/blog/CryptoCurrencyThumb.jpg - images/blog/CryptoCurrencyThumb.jpg
header:
- images/blog/CryptoCurrencyBanner.jpg
tags: tags:
- Cryptopayments - Cryptopayments
- Open Source Design - Open Source Design
@ -19,7 +21,7 @@ excerpt:
We aim to iterate our processes continously based on the feedback and experiences we have with projects we are lucky to work with. With this in mind, we noticed that some of our partners prefer to use Paypal and others bank transactions, which has been for many years the standard process of payments for services similar to what we offer. As a design studio which highly values decentralized platforms, we have been positively surprised to see growing demand for payment integration of different **cryptocurrencies**. This is the reason that starting from today, we accept payments with some of the most established cryptocurrencies at the moment such as **Bitcoin**, **Ethereum** and **Litecoin**. If none of the above works for you, [let us know](mailto:hello@ura.design) and our team will be happy to find an alternative. We aim to iterate our processes continously based on the feedback and experiences we have with projects we are lucky to work with. With this in mind, we noticed that some of our partners prefer to use Paypal and others bank transactions, which has been for many years the standard process of payments for services similar to what we offer. As a design studio which highly values decentralized platforms, we have been positively surprised to see growing demand for payment integration of different **cryptocurrencies**. This is the reason that starting from today, we accept payments with some of the most established cryptocurrencies at the moment such as **Bitcoin**, **Ethereum** and **Litecoin**. If none of the above works for you, [let us know](mailto:hello@ura.design) and our team will be happy to find an alternative.
<div class="large-10 large-centered columns"> <div class="large-10 large-centered columns">
<img class="lazy" data-src="/images/blog/CryptoCurrencyBanner.jpg"> <img src="/images/blog/CryptoCurrencyBanner.jpg">
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>

2
about.html

@ -80,7 +80,7 @@ members:
<div class="row"> <div class="row">
<div class="large-12 large-centered columns"> <div class="large-12 large-centered columns">
<p>Ura is a digital studio 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. We specialize in UX Design, Design Systems Research and Visual Identity.</p> <p>Ura is a digital studio 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. We specialize in UX Design, Design Systems Research and Visual Identity.</p>
<p>Our work can be seen across various Open Source projects such as <a href="https://mozilla.org" target="_blank" rel="noopener">Mozilla</a>, <a href="https://www.torproject.org" target="_blank" rel="noopener">The Tor Project</a> and <a href="https://www.linuxfoundation.org" target="_blank" rel="noopener">The Linux Foundation</a>.</p> <p>Our work can be seen across various Open Source projects such as <a href="https://mozilla.org" target="_blank">Mozilla</a>, <a href="https://www.torproject.org" target="_blank">The Tor Project</a> and <a href="https://www.linuxfoundation.org" target="_blank">The Linux Foundation</a>.</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> <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> </div>
</div> </div>

4
blog/index.html

@ -27,7 +27,7 @@ section_id: blog
<div class="large-8 columns bottom-blog"> <div class="large-8 columns bottom-blog">
<div class="post-content blog"> <div class="post-content blog">
<h3 id="blog-title" class="blog"><a href="{{ post.url | replace:'.html','' }}">{{post.title}}</a></h3> <h3 id="blog-title" class="blog"><a href="{{ post.url | replace:'.html','' }}">{{post.title}}</a></h3>
<p class="blogauthor">by <a href="{{post.link}}" target="_blank" rel="noopener">{{post.author}}</a></p> <p class="blogauthor">by <a href="{{post.link}}" target="_blank">{{post.author}}</a></p>
<p>{{post.excerpt}}</p> <p>{{post.excerpt}}</p>
<div class="tags"> <div class="tags">
{% for tag in post.tags %} {% for tag in post.tags %}
@ -39,7 +39,7 @@ section_id: blog
</div> </div>
<div class="large-3 columns blog middle-blog" style="margin-bottom: 30px;"> <div class="large-3 columns blog middle-blog" style="margin-bottom: 30px;">
{% if post.images %} {% if post.images %}
<a href="{{ post.url | replace:'.html','' }}"><img class="lazy" style="display: block; margin: auto;" data-src="{{site.url}}/{{post.images[0]}}" alt="post"></a> <a href="{{ post.url | replace:'.html','' }}"><img style="display: block; margin: auto;" src="{{site.url}}/{{post.images[0]}}" alt="post"></a>
{% endif %} {% endif %}
</div> </div>
</div> </div>

2
css/app.css

@ -3435,7 +3435,7 @@ ul.pagination {
.pricing-table .title { .pricing-table .title {
background-color: #333333; background-color: #333333;
color: #EEEEEE; color: #EEEEEE;
font-family: "Overpass", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; font-family: '"Overpass", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
font-size: 1rem; font-size: 1rem;
font-weight: normal; font-weight: normal;
padding: 0.9375rem 1.25rem; padding: 0.9375rem 1.25rem;

1
css/linea-arrows-styles.css

@ -9,6 +9,7 @@
url("../fonts/linea-arrows/linea-arrows-10.svg#linea-arrows-10") format("svg"); url("../fonts/linea-arrows/linea-arrows-10.svg#linea-arrows-10") format("svg");
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
[data-icon]:before { [data-icon]:before {

1
css/linea-styles.css

@ -9,6 +9,7 @@
url("../fonts/linea/linea-basic-10.svg#linea-basic-10") format("svg"); url("../fonts/linea/linea-basic-10.svg#linea-basic-10") format("svg");
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
[data-icon]:before { [data-icon]:before {

4
css/slick-theme.css

@ -1,8 +1,8 @@
@charset "UTF-8"; @charset "UTF-8";
/* Slider */ /* Slider */
/* .slick-loading .slick-list { /*.slick-loading .slick-list {
background: #fff url("./ajax-loader.gif") center center no-repeat; }*/ background: #fff url("./ajax-loader.gif") center center no-repeat; }*/
/* Icons */ /* Icons */
/*@font-face { /*@font-face {
font-family: "slick"; font-family: "slick";

12
css/style.css

@ -361,9 +361,6 @@ body {
.button.thunderbird::before { .button.thunderbird::before {
background: #0A84FF; } background: #0A84FF; }
.button.libocon::before {
background: #11A500; }
.button.boxed.white { .button.boxed.white {
border: 1px solid #fff; border: 1px solid #fff;
background: none; background: none;
@ -458,15 +455,6 @@ body {
color: #fff; color: #fff;
background: #0A84FF; } background: #0A84FF; }
.button.boxed.libocon {
border: 1px solid #11A500;
background: none;
color: #11A500; }
.button.boxed.libocon:hover {
color: #fff;
background: ##11A500; }
.button.boxed.openlabs { .button.boxed.openlabs {
border: 1px solid #2BBBB0; border: 1px solid #2BBBB0;
background: none; background: none;

BIN
images/projects/tb_overview.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 24 KiB

28
index.html

@ -110,7 +110,7 @@ clients:
</div> </div>
<div class="slide-left" style="background-color: {{ slide.bg_color }};"> <div class="slide-left" style="background-color: {{ slide.bg_color }};">
</div> </div>
<div class="slide-right {{ slide.overlay }} lazy" style="background: url({{ slide.image }}) center center no-repeat;background-size: cover;"> <div class="slide-right {{ slide.overlay }}" style="background: url({{ slide.image }}) center center no-repeat;background-size: cover;">
</div> </div>
</div> </div>
{% endfor %} {% endfor %}
@ -126,7 +126,7 @@ clients:
<div class="section-title"> <div class="section-title">
<div class="row"> <div class="row">
<div class="medium-10 medium-centered columns"> <div class="medium-10 medium-centered columns">
<img data-src="images/main/icon.svg" alt="" class="lazy wow flipInY" data-wow-duration="2s" data-wow-delay="0.1s"> <img src="images/main/icon.svg" alt="" class="wow flipInY" data-wow-duration="2s" data-wow-delay="0.1s">
<div class="spacing"></div> <div class="spacing"></div>
<h2>Design, but Open</h2> <h2>Design, but Open</h2>
</div> </div>
@ -135,8 +135,8 @@ clients:
<div class="row"> <div class="row">
<div class="large-10 large-centered columns"> <div class="large-10 large-centered columns">
<p>Ura is a digital studio 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. We specialize in UX Design, Design Systems Research and Visual Identity.</p> <p>Ura is a digital studio 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. We specialize in UX Design, Design Systems Research and Visual Identity.</p>
<p>Our work can be seen across various Open Source projects such as <a href="https://mozilla.org" target="_blank" rel="noopener">Mozilla</a>, <a href="https://www.torproject.org" target="_blank" rel="noopener">The Tor Project</a> and <a href="https://www.linuxfoundation.org" target="_blank" rel="noopener">The Linux Foundation</a>.</p> <p>Our work can be seen across various Open Source projects such as <a href="https://mozilla.org" target="_blank">Mozilla</a>, <a href="https://www.torproject.org" target="_blank">The Tor Project</a> and <a href="https://www.linuxfoundation.org" target="_blank">The Linux Foundation</a>.</p>
<p>We also develop <a href="https://identihub.co" target="_blank" rel="noopener">Identihub</a>, Open Source Software to self-host visual assets and identities to ease collaboration between designers and developers.</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="two spacing"></div>
<div class="centered-text"> <div class="centered-text">
<a href="about" class="button boxed blue">Learn more</a> <a href="about" class="button boxed blue">Learn more</a>
@ -158,7 +158,7 @@ clients:
<div class='large-12 columns'> <div class='large-12 columns'>
<div class='clients'> <div class='clients'>
{% for client in page.clients %} {% for client in page.clients %}
<div><a href="{{client.url}}" target="blank" rel="noopener"><img alt="" class="lazy" data-src="{{site.baseurl}}/{{client.image}}" width="200px" height="120px"></a></div> <div><a href="{{client.url}}" target="blank"><img alt="" src="{{site.baseurl}}/{{client.image}}" width="200px" height="120px"></a></div>
{% endfor %} {% endfor %}
</div> </div>
</div> </div>
@ -181,11 +181,11 @@ clients:
<div class="quote wow slideInLeft" data-wow-delay="{{ 0.25 | times:forloop.index0 }}s"> <div class="quote wow slideInLeft" data-wow-delay="{{ 0.25 | times:forloop.index0 }}s">
<div class="row"> <div class="row">
<div class="small-3 columns"> <div class="small-3 columns">
<img class="lazy" data-src="{{testimonial.avatar}}" width="102px" height="102px" alt="author"> <img src="{{testimonial.avatar}}" width="102px" height="102px" alt="author">
</div> </div>
<div class="small-9 columns"> <div class="small-9 columns">
<p>{{testimonial.content}}</p> <p>{{testimonial.content}}</p>
<a href="{{testimonial.twitter}}" rel="noopener"><p class="author">{{testimonial.author}}</p></a> <a href="{{testimonial.twitter}}"><p class="author">{{testimonial.author}}</p></a>
</div> </div>
</div> </div>
</div> </div>
@ -196,11 +196,11 @@ clients:
<div class="quote reverse wow slideInRight" class="wow" data-wow-delay="{{ 0.25 | times:forloop.index0 }}s"> <div class="quote reverse wow slideInRight" class="wow" data-wow-delay="{{ 0.25 | times:forloop.index0 }}s">
<div class="row"> <div class="row">
<div class="small-3 columns"> <div class="small-3 columns">
<img class="lazy" data-src="{{testimonial.avatar}}" width="102px" height="102px" alt="author"> <img src="{{testimonial.avatar}}" width="102px" height="102px" alt="author">
</div> </div>
<div class="small-9 columns"> <div class="small-9 columns">
<p>{{testimonial.content}}</p> <p>{{testimonial.content}}</p>
<a href="{{testimonial.twitter}}" rel="noopener"><p class="author">{{testimonial.author}}</p></a> <a href="{{testimonial.twitter}}"><p class="author">{{testimonial.author}}</p></a>
</div> </div>
</div> </div>
</div> </div>
@ -226,7 +226,7 @@ clients:
{% for work in page.works_left %} {% for work in page.works_left %}
<div class="work-wrapper"> <div class="work-wrapper">
<a href="{{work.link_to}}" class="work"> <a href="{{work.link_to}}" class="work">
<img data-src="{{site.url}}/{{work.image}}" alt="" class="lazy"> <img src="{{site.url}}/{{work.image}}" alt="">
<div class="info"> <div class="info">
<h3>{{work.title}}</h3> <h3>{{work.title}}</h3>
<p>{{work.categories}}</p> <p>{{work.categories}}</p>
@ -239,7 +239,7 @@ clients:
{% for work in page.works_middle %} {% for work in page.works_middle %}
<div class="work-wrapper"> <div class="work-wrapper">
<a href="{{work.link_to}}" class="work"> <a href="{{work.link_to}}" class="work">
<img data-src="{{site.url}}/{{work.image}}" alt="" class="lazy"> <img src="{{site.url}}/{{work.image}}" alt="">
<div class="info"> <div class="info">
<h3>{{work.title}}</h3> <h3>{{work.title}}</h3>
<p>{{work.categories}}</p> <p>{{work.categories}}</p>
@ -252,7 +252,7 @@ clients:
{% for work in page.works_right %} {% for work in page.works_right %}
<div class="work-wrapper"> <div class="work-wrapper">
<a href="{{work.link_to}}" class="work"> <a href="{{work.link_to}}" class="work">
<img data-src="{{site.url}}/{{work.image}}" alt="" class="lazy"> <img src="{{site.url}}/{{work.image}}" alt="">
<div class="info"> <div class="info">
<h3>{{work.title}}</h3> <h3>{{work.title}}</h3>
<p>{{work.categories}}</p> <p>{{work.categories}}</p>
@ -269,8 +269,8 @@ clients:
<div class="two spacing"></div> <div class="two spacing"></div>
<div id="newsletter" class='row'> <div id="newsletter" class='row'>
<div class='medium-10 medium-centered centered-text columns'> <div class='medium-10 medium-centered centered-text columns'>
<p>Stay updated with our newsletter!</p> <p>Stay updated with our Newsletter!</p>
<a class="button boxed black" href="https://uradesign.hosted.phplist.com/lists/?p=subscribe&id=1" target="_blank" rel="noopener">SUBSCRIBE</a> <a class="button boxed black" href="https://uradesign.hosted.phplist.com/lists/?p=subscribe&id=1" target="_blank">SUBSCRIBE</a>
</div> </div>
<div class="two spacing"></div> <div class="two spacing"></div>
</div> </div>

3
js/.htaccess

@ -0,0 +1,3 @@
<IfModule mod_headers.c>
Header set Cache-Control "max-age=15778476, public"
</IfModule>

301
js/lazyload.js

@ -0,0 +1,301 @@
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
(function (global, factory) {
(typeof exports === 'undefined' ? 'undefined' : _typeof(exports)) === 'object' && typeof module !== 'undefined' ? module.exports = factory() : typeof define === 'function' && define.amd ? define(factory) : global.LazyLoad = factory();
})(this, function () {
'use strict';
var getInstanceSettings = function getInstanceSettings(customSettings) {
var defaultSettings = {
elements_selector: "img",
container: document,
threshold: 300,
data_src: "src",
data_srcset: "srcset",
data_sizes: "sizes",
class_loading: "loading",
class_loaded: "loaded",
class_error: "error",
callback_load: null,
callback_error: null,
callback_set: null,
callback_enter: null
};
return _extends({}, defaultSettings, customSettings);
};
var dataPrefix = "data-";
var processedDataName = "was-processed";
var processedDataValue = "true";
var getData = function getData(element, attribute) {
return element.getAttribute(dataPrefix + attribute);
};
var setData = function setData(element, attribute, value) {
return element.setAttribute(dataPrefix + attribute, value);
};
var setWasProcessed = function setWasProcessed(element) {
return setData(element, processedDataName, processedDataValue);
};
var getWasProcessed = function getWasProcessed(element) {
return getData(element, processedDataName) === processedDataValue;
};
function purgeElements(elements) {
return elements.filter(function (element) {
return !getWasProcessed(element);
});
}
/* Creates instance and notifies it through the window element */
var createInstance = function createInstance(classObj, options) {
var event;
var eventString = "LazyLoad::Initialized";
var instance = new classObj(options);
try {
// Works in modern browsers
event = new CustomEvent(eventString, { detail: { instance: instance } });
} catch (err) {
// Works in Internet Explorer (all versions)
event = document.createEvent("CustomEvent");
event.initCustomEvent(eventString, false, false, { instance: instance });
}
window.dispatchEvent(event);
};
/* Auto initialization of one or more instances of lazyload, depending on the
options passed in (plain object or an array) */
function autoInitialize(classObj, options) {
if (!options.length) {
// Plain object
createInstance(classObj, options);
} else {
// Array of objects
for (var i = 0, optionsItem; optionsItem = options[i]; i += 1) {
createInstance(classObj, optionsItem);
}
}
}
var setSourcesInChildren = function setSourcesInChildren(parentTag, attrName, dataAttrName) {
for (var i = 0, childTag; childTag = parentTag.children[i]; i += 1) {
if (childTag.tagName === "SOURCE") {
var attributeValue = getData(childTag, dataAttrName);
if (attributeValue) {
childTag.setAttribute(attrName, attributeValue);
}
}
}
};
var setAttributeIfNotNullOrEmpty = function setAttributeIfNotNullOrEmpty(element, attrName, value) {
if (!value) {
return;
}
element.setAttribute(attrName, value);
};
var setSources = function setSources(element, settings) {
var sizesDataName = settings.data_sizes,
srcsetDataName = settings.data_srcset,
srcDataName = settings.data_src;
var srcDataValue = getData(element, srcDataName);
switch (element.tagName) {
case "IMG":
{
var parent = element.parentNode;
if (parent && parent.tagName === "PICTURE") {
setSourcesInChildren(parent, "srcset", srcsetDataName);
}
var sizesDataValue = getData(element, sizesDataName);
setAttributeIfNotNullOrEmpty(element, "sizes", sizesDataValue);
var srcsetDataValue = getData(element, srcsetDataName);
setAttributeIfNotNullOrEmpty(element, "srcset", srcsetDataValue);
setAttributeIfNotNullOrEmpty(element, "src", srcDataValue);
break;
}
case "IFRAME":
setAttributeIfNotNullOrEmpty(element, "src", srcDataValue);
break;
case "VIDEO":
setSourcesInChildren(element, "src", srcDataName);
setAttributeIfNotNullOrEmpty(element, "src", srcDataValue);
break;
default:
if (srcDataValue) {
element.style.backgroundImage = 'url("' + srcDataValue + '")';
}
}
};
var isBot = "onscroll" in window && !/glebot/.test(navigator.userAgent);
var runningOnBrowser = typeof window !== "undefined";
var supportsIntersectionObserver = runningOnBrowser && "IntersectionObserver" in window;
var supportsClassList = runningOnBrowser && "classList" in document.createElement("p");
var addClass = function addClass(element, className) {
if (supportsClassList) {
element.classList.add(className);
return;
}
element.className += (element.className ? " " : "") + className;
};
var removeClass = function removeClass(element, className) {
if (supportsClassList) {
element.classList.remove(className);
return;
}
element.className = element.className.replace(new RegExp("(^|\\s+)" + className + "(\\s+|$)"), " ").replace(/^\s+/, "").replace(/\s+$/, "");
};
var callCallback = function callCallback(callback, argument) {
if (callback) {
callback(argument);
}
};
var loadString = "load";
var errorString = "error";
var removeListeners = function removeListeners(element, loadHandler, errorHandler) {
element.removeEventListener(loadString, loadHandler);
element.removeEventListener(errorString, errorHandler);
};
var addOneShotListeners = function addOneShotListeners(element, settings) {
var onLoad = function onLoad(event) {
onEvent(event, true, settings);
removeListeners(element, onLoad, onError);
};
var onError = function onError(event) {
onEvent(event, false, settings);
removeListeners(element, onLoad, onError);
};
element.addEventListener(loadString, onLoad);
element.addEventListener(errorString, onError);
};
var onEvent = function onEvent(event, success, settings) {
var element = event.target;
removeClass(element, settings.class_loading);
addClass(element, success ? settings.class_loaded : settings.class_error); // Setting loaded or error class
callCallback(success ? settings.callback_load : settings.callback_error, element);
};
function revealElement(element, settings, force) {
if (!force && getWasProcessed(element)) {
return; // element has already been processed and force wasn't true
}
callCallback(settings.callback_enter, element);
if (["IMG", "IFRAME", "VIDEO"].indexOf(element.tagName) > -1) {
addOneShotListeners(element, settings);
addClass(element, settings.class_loading);
}
setSources(element, settings);
setWasProcessed(element);
callCallback(settings.callback_set, element);
}
/* entry.isIntersecting needs fallback because is null on some versions of MS Edge, and
entry.intersectionRatio is not enough alone because it could be 0 on some intersecting elements */
var isIntersecting = function isIntersecting(element) {
return element.isIntersecting || element.intersectionRatio > 0;
};
var getObserverSettings = function getObserverSettings(settings) {
return {
root: settings.container === document ? null : settings.container,
rootMargin: settings.threshold + "px"
};
};
var LazyLoad = function LazyLoad(customSettings, elements) {
this._settings = getInstanceSettings(customSettings);
this._setObserver();
this.update(elements);
};
LazyLoad.prototype = {
_setObserver: function _setObserver() {
var _this = this;
if (!supportsIntersectionObserver) {
return;
}
var revealIntersectingElements = function revealIntersectingElements(entries) {
entries.forEach(function (entry) {
if (isIntersecting(entry)) {
var element = entry.target;
_this.load(element);
_this._observer.unobserve(element);
}
});
_this._elements = purgeElements(_this._elements);
};
this._observer = new IntersectionObserver(revealIntersectingElements, getObserverSettings(this._settings));
},
loadAll: function loadAll() {
var _this2 = this;
this._elements.forEach(function (element) {
_this2.load(element);
});
this._elements = purgeElements(this._elements);
},
update: function update(elements) {
var _this3 = this;
var settings = this._settings;
var nodeSet = elements || settings.container.querySelectorAll(settings.elements_selector);
this._elements = purgeElements(Array.prototype.slice.call(nodeSet)); // nodeset to array for IE compatibility
if (isBot || !this._observer) {
this.loadAll();
return;
}
this._elements.forEach(function (element) {
_this3._observer.observe(element);
});
},
destroy: function destroy() {
var _this4 = this;
if (this._observer) {
purgeElements(this._elements).forEach(function (element) {
_this4._observer.unobserve(element);
});
this._observer = null;
}
this._elements = null;
this._settings = null;
},
load: function load(element, force) {
revealElement(element, this._settings, force);
}
};
/* Automatic instances creation if required (useful for async script loading!) */
var autoInitOptions = window.lazyLoadOptions;
if (runningOnBrowser && autoInitOptions) {
autoInitialize(LazyLoad, autoInitOptions);
}
return LazyLoad;
});

2
js/lazyload.min.js

File diff suppressed because one or more lines are too long

11
projects/index.html

@ -36,10 +36,7 @@ works_right:
link_to: enigmail link_to: enigmail
image: images/projects/enigmail_overview.png image: images/projects/enigmail_overview.png
categories: Visual Identity categories: Visual Identity
- title: LibOCon 2018 Visual Identity
link_to: libocon
image: images/projects/libocon_overview.png
categories: Visual Identity
--- ---
<div class="full new" style="background-color: #3399d4;"> <div class="full new" style="background-color: #3399d4;">
@ -59,7 +56,7 @@ works_right:
{% for work in page.works_left %} {% for work in page.works_left %}
<div class="work-wrapper"> <div class="work-wrapper">
<a href="{{work.link_to}}" class="work"> <a href="{{work.link_to}}" class="work">
<img src="{{site.baseurl}}/{{work.image}}" alt=""> <img src="{{site.url}}/{{work.image}}" alt="">
<div class="info"> <div class="info">
<h3>{{work.title}}</h3> <h3>{{work.title}}</h3>
<p>{{work.categories}}</p> <p>{{work.categories}}</p>
@ -72,7 +69,7 @@ works_right:
{% for work in page.works_middle %} {% for work in page.works_middle %}
<div class="work-wrapper"> <div class="work-wrapper">
<a href="{{work.link_to}}" class="work"> <a href="{{work.link_to}}" class="work">
<img src="{{site.baseurl}}/{{work.image}}" alt=""> <img src="{{site.url}}/{{work.image}}" alt="">
<div class="info"> <div class="info">
<h3>{{work.title}}</h3> <h3>{{work.title}}</h3>
<p>{{work.categories}}</p> <p>{{work.categories}}</p>
@ -85,7 +82,7 @@ works_right:
{% for work in page.works_right %} {% for work in page.works_right %}
<div class="work-wrapper"> <div class="work-wrapper">
<a href="{{work.link_to}}" class="work"> <a href="{{work.link_to}}" class="work">
<img src="{{site.baseurl}}/{{work.image}}" alt=""> <img src="{{site.url}}/{{work.image}}" alt="">
<div class="info"> <div class="info">
<h3>{{work.title}}</h3> <h3>{{work.title}}</h3>
<p>{{work.categories}}</p> <p>{{work.categories}}</p>

91
projects/libocon.html

@ -1,91 +0,0 @@
---
layout: default
section_id: portfolio
title: LibOCon 2018 Visual Identity
---
<div style="background-color: #11a500;" 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;">LibOCon 2018 Visual Identity</h1>
</div>
</div>
</div>
</div>
<div class="full text">
<div class="row">
<div class="large-8 columns">
<img src="../images/projects/libocon.png" alt="">
<div class="spacing"></div>
<img src="../images/projects/libocon_totebag.png" alt="">
<div class="spacing"></div>
</div>
<div class="large-4 columns">
<div class="project-intro">
<p>LibOCon is the annual gathering of the LibreOffice community. At LibOCon, LibreOffice users gather to network and meet key LibreOffice developers, designers, localizers, documenters, supporters and marketers, and to learn about the latest in LibreOffice development.</p>
<p>We worked on the conference visual identity as a sponsor of the event.</p>
<hr>
<div class="spacing"></div>
<h4>Date</h4>
<p><span>September, 2018</span></p>
<h4>Clients</h4>
<p><span><a href="https://libocon.org" target="_blank" rel="noopener">LibOCon</a></span></p>
<h4>Category</h4>
<p><span>Visual Identity</span></p>
<hr>
<a class="button boxed black" href="https://github.com/uracreative/works/tree/master/LibOCon 2018" target="_blank" rel="noopener"><i class="fab fa-github"></i> Sources</a><br />
<a class="button boxed identihub" href="https://demo.identihub.co/project/libocon" target="_blank" rel="noopener"><img src="../images/projects/identihub.svg" > Identihub</a><br />
<a class="button boxed libocon" href="https://libocon.org" target="_blank" rel="noopener"><i class="fas fa-globe"></i> Website</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="openlabs" class="work">
<img src="../images/projects/openlabs.jpg" alt="">
<div class="info">
<h3>Open Labs</h3>
<p>Rebranding</p>
</div>
</a>
</div>
</div>
<div class="large-4 columns">
<div class="work-wrapper">
<a href="tor-style-guide" class="work">
<img 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="mozilla-l10n" class="work">
<img src="../images/projects/mozilla-l10n.jpg" alt="">
<div class="info">
<h3>Mozilla L10N T-shirts</h3>
<p>Print</p>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
Loading…
Cancel
Save