← All work

Knowable Magazine: bilingual, image-led science journalism

Technically the first magazine built on our journal platform: a visual, topic-led publication in English and Spanish, funded by donations rather than a paywall.

Role: UX and front-end developer

Knowable Magazine home page: logo, topic navigation and a full-width black and white image with the lead headline over it.
Home page, desktop. Live site.
A Knowable article page: a large illustration with the headline and standfirst in a card overlapping its lower edge.
Article opening. Live site.
Knowable advanced search form with keyword fields, date range, sort order and collection filters.
Advanced search. Live site.
Knowable home page on a phone: logo and menu in the header, lead image with headline, and English and Spanish newsletter buttons stacked below.
Home page, mobile. Live site.

The problem

Knowable publishes free science journalism, and the site had to draw readers in with strong imagery, make topics easy to browse, serve readers in two languages and ask for support without a paywall. It came to us as an existing website. Annual Reviews liked the design and did not want it changed, so the job was to port it onto our journal platform using largely the same markup and design. It was technically the first magazine we built.

What I did

  1. Ported the existing site onto the journal platform, keeping largely the same markup and design, as Annual Reviews asked.
  2. Kept the full-width image opening on the home page and every article, with the headline set over or just below it.
  3. Kept the eight topic categories in the main navigation so readers can browse by subject.
  4. Carried over the language switch in the header and the newsletter offered in English and Spanish side by side.
  5. Kept the Donate button in the header and the dismissible banner that says plainly the site is not a paywall.
  6. Stacked the hero and sign-up buttons into a single column on phones.
  7. Created the drag-and-drop block editor, which was later integrated as part of the development of the "Katina" site.

The outcome

The block-level drag and drop editing tools, built by me in-house working for Ingenta, have significantly reduced the time it takes an editor to create an article on the site. They have been well received by our customer, Annual Reviews, who has praised them for being very intuitive.