An independent archive of typography.
Topics
Formats
Typefaces

Citationsy

Contributed by Citationsy on Feb 7th, 2020. Artwork published in
January 2020
.
The new Citationsy logo
Source: citationsy.com Photo: Citationsy. License: All Rights Reserved.

The new Citationsy logo

Citationsy uses Georgia as its logotype, and iA Writer Quattro for the interface.

Over the last couple months we worked with a design agency in Leipzig – Büro 222 – to completely overhaul the look and feel of Citationsy. This affects both the web version (www.citationsy.com) as well as our mobile apps (iOS and Android). The redesign also includes a brand-new logo.

Lukas Löffler, Büro 222:

The goal of the new design was to take Citationsy seriously as a tool, and to optimise the user interface for a concentrated and distraction free workflow. With Georgia as our brand typeface we decided on a timeless classic that radiates practicality and was engineered specifically for screen use. It also loads instantly, since it comes pre-installed on all computers. Georgia is not typically used in large sizes, and by doing so we let its confident, literary personality shine. Also, it has the most beautiful asterisk * of all.

Citationsy’s old logo was just the word “Citationsy“ set in our font back then, Aileron. For the new logo, they chose the typeface Georgia and added the asterisk. The asterisk also works brilliantly on its own, as a favicon or app icon.

In the app itself we consolidated all the functions into the right hand sidebar, labelling them and making things (hopefully) more obvious. We also made several usability improvements, like not having to go into the edit screen on a reference to delete it – you can now delete references in the project.

Our old website only had one colour, a random blue. On the new website we use the same five colours as the Citationsy app itself does.

App icon and favicon
Source: citationsy.com Photo: Citationsy. License: All Rights Reserved.

App icon and favicon

Citationsy 3
Source: citationsy.com Photo: Citationsy. License: All Rights Reserved.
The web and mobile UI
Source: citationsy.com Photo: Citationsy. License: All Rights Reserved.

The web and mobile UI

Example of a form
Source: citationsy.com Photo: Citationsy. License: All Rights Reserved.

Example of a form

The Citationsy website
Source: citationsy.com Photo: Citationsy. License: All Rights Reserved.

The Citationsy website

Typefaces

  • Georgia
  • iA Writer Quattro

Formats

Topics

Designers/Agencies

Artwork location

Post a comment