For the love of language. Designing for erudition. Marvelous, extraordinary, astounding remarkable, miraculous — this essentially was our goal during design and engineering of the app created to make humans communication more accurate, polite and delightful.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/ec905a48-2199-451f-a3d7-c041d2b99289/Medium-Designing-Dark_Mode-Light_state.jpg

Intention

Daniel and I are passionate about English, especially as it’s not our native language. You can communicate efficiently knowing just around 1,000 words. However, you can make it accurate, pleasant and full of regard for others using several more.

It’s a scientific evidence that every new experience or information stimulates creating new neural connections in our brains. It means that, knowing one word we can quickly learn a new one as the first one immediately becomes a reference for the new one.

It takes place due to the process of perception which begins with an object in the real world, termed the distal object. The object stimulates human’s brain. Then the stimulus is transformed into neural activity — a process called transduction. The neural signal is transmitted to the brain and processed. The resulting mental re-creation of the distal stimulus is the percept. So that’s exactly what happens when we discover new vocabulary based on words or idioms we’ve already known.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/35fbd516-3670-461d-b764-bd1f0a4e5742/1QWLemMImftCOlsY0HMxAsg.jpeg

We decided to build an interface that would allow anyone to enrich their vocabulary.

Spine

We’ve created a horizontal architecture to let users easily navigate between screens by just a simple swipe. The only vertical flow leads to a modal where users can find out more about the benefits of the full version and eventually choose a preferable subscription.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/fe17273a-67ae-4fc1-bc63-e8b3b8ffcd82/1MpYry3Sm2jCdJy_4rvF78g.jpeg

The D view — subscription modal — unites all 3 touchpoints. They were intentionally designed to emphasize the value of paid version in the context, e.g. when users search for synonyms only one is visible while the rest is blurred. This is followed by a blue button presenting a particular number of available synonyms in the form of a CTA label.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/309566bd-85ef-48f2-8c47-70f565768eb2/1CJ-Q73V_mWn_IZdvCrkGcw.jpeg

Design

We wanted to make the visual layer explicit while interactive one immediately familiar. Typography plays an ever so important role in this interface we’ve crafted. Its weights and heights were meticulously specified to fit context and ease perception of contents. Italics represent synonym references. The colour palette we’ve created helps to enhance focal points. Chartreuse and teal colours emphasize the relevance of particular contexts and distinguish Lexicon branding. Colorful elements in the background provide feedback and complement content while rewarding users with soft appealing visuals.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/8a728663-98a6-4f77-98f1-9f000676dd82/1vmomLPMGlop5dgcdc3fSOw.jpeg

When it comes to interactions we’ve taken really deep care of letting users interact with the interface using just one hand. In the matter of that, a simple swipe left or right takes users to a different tab what’s indicated by page controls at the top of view getting scale up or down and contrast. Users can save and remove synonyms by familiar gestures. Long press on a search result lets users save it while dragging it towards left lets to remove saved synonym.

https://vimeo.com/387548303

During work on the Lexcion app, we’ve often used it in the evenings. Due to its brightness, we quite naturally felt a need for dark mode. To achieve it almost effortlessly we’ve applied system colours representing equivalents for either light and dark mode. While the app remained unobtrusive and beautiful now it fatigues eyes less simultaneously decreasing battery drain.