I love Tumult Hype. And I love Open Journal Systems (OJS). But put the two together and you have an incredible tool for affordable, modern web design for scholarly journals.
OJS is an incredible open source platform that allows research institutes and scientists all over the world to host and run their own scholarly journals without signing up to expensive proprietary publishing software and hosting companies.
OJS is like WordPress for scholarly publications. You get a backend content management system, which doubles as a submission system to handle the peer review and publication process. And you choose from a number of ‘themes’ and ‘plugins’ to customise the frontend appearance and extend site functionality.
Amazing functionality but limited web design
For anyone with an eye for modern web design, OJS has some problems. Many of the themes are rather old fashioned in their design, and while some more modern looking themes are available, they still have somewhat of an unfinished quality from a graphic design perspective. For non-coders, or for editorial teams without deep pockets to pay for customised theme design, this can pose a bit of a problem.
Do you want a big modern hero section to feature the most recent articles published? Do you need a more attractive footer, clearer call to action buttons and ad-hoc adverts or news posts to feature on the front page of the journal website? In these cases, OJS has the functionality, but lacks the design of famous high-impact journals like Nature and the AGU journals – all of which have had facelifts of late.
But, there is a solution: Tumult Hype Pro.
HTML web-elements with no coding
Tumult Hype has been on the scene for a while. It’s a way of designing and exporting HTML graphics and other web elements without typing a single line of code. Although if you are comfortable with Javascript and CSS you can do even much more with it.
I use it frequently to produce interactive graphics, for example here and here. I even used it to create a memory game as a hobby project for a children’s story book. So, when looking to adopt OJS for the scholarly journal that I oversee as Editor in Chief, I knew that I could achieve the design I wanted with the help of Tumult Hype.
First, I worked with one of the graphic designers at my research institute to develop an overall customised look for the website (colours, fonts, borders, shading) that our hosting company, Open academia could use to create customised CSS. This is easily uploaded to the site as part of OJS.
Second, I used Tumult Hype to design and export a hero slider, a new call to action button with micro interactions, an undated and responsive footer with call to action social media and sharing buttons and a sidebar advert to draw readers to the journal’s online shop area.
The three stooges: Github, Tumult + OJS
Once I had created the elements, I had to get them into OJS. This was straightforward: by hosting the elements on GitHub, they could be embedded where needed on the website using iframe HTML code.
A few more adjustments were made to the custom CSS file to remove padding here and there, and voila! We now have a modern hero carousel, a unique call to action button up top, a responsive footer and a snazzy secondary call to action that maintain journal branding and colours throughout.
All together, we achieved a modern design, befitting of a serious scholarly publication, which complement and boost the interesting science on offer.
