The website directs to a member system supplied by our long-time system supplier, Schmitzmine. These pages remained untouched in terms of content and usability. A colour refresh and general updates were implemented to match the look and fresh feel of the new ISN website.
Introduction
The International Society for Neurochemistry (ISN) is a non-profit membership organisation and the only international society focused on neurochemistry. With a proud history dating back to its establishment in 1965, ISN strives to promote all relevant aspects of molecular and cellular neuroscience.
ISN supports the neuroscience community, connecting people around the globe and across specialties. For this, having a modern website that is user-friendly and useful housing information for all members was of high importance. A new website would give better control over the association’s brand and image and further promote a more positive relationship between members and ISN, as the old website was outdated in terms of design and content. A new website would also allow us to restructure the back-end, which in its current form was a time- consuming effort to make any updates.
Discovery
We asked prominent ISN members, both young scientist and senior professors, to look for certain items on the old website. While looking for those, we also asked them to speak out loud about what they were looking for and which action they were taking. From this, we could see the thought process and how they interacted online.
After that, and based on the information we collected, we created Personas for all our potential site visitors.
This exercise gave us the key insights on what to look for in the new platform in terms of design and functionality.
We were able to see the differences in the two demographics, whilst looking for the same information they both has a different approach to using the website and both had different expectations how the website should respond.
Objectives
Besides a visually appealing and interactive website, the main goal was for the desired content to be readily accessible. Measurable objectives were the reduction in e- mail questions towards the secretariat. Furthermore, an increase in website traffic and SEO.
With this project we aimed to:
Gain a competitive edge
Improve communications
Increase credibility
Reduce overflow of information
Reduce the time for content updating
Reduction of Bounce Rate
Consistency in terms of the new ISN brand identity
KPIs:
Reduction of Bounce Rate of the new website Vs Bounce Rate of the old website
Reduction of Avg. Session Duration (easier for the visitors to find the information they are looking for)
Increase of Website sessions
Increase of visitors from Mobile / Tablet devices
Timeline
August:
Brand Identity Revamp approved
Sitemap creation
Wireframe creation + Feedback
September:
Content Collection / Creation
October:
Visuals + Coding + Feedback
Testing & soft launch
November:
Official launch*
Launch + Post-launch updates
*The official launch (announcement via marcom channels) was cancelled due to the sudden passing of the ISN President. It was decided to draw attention to the new website at a later, more appropriate stage.
Logo versions, screenshot from the Brand Manual
Activities
Brand Identity Revamp: Since the plan was to have a new website appealing to young and senior (potential) members we had to start with ISN’s image. Therefore, the first deliverable and the foundation of our project was the creation of a Brand manual that will give us the opportunity to refresh ISN look and simultaneously keep all of our design on the straight and narrow. Additionally, many peripheral materials have been created (template for ppt, business cards, letterheads, email signatures etc).
Feedback: During the whole project, we had two feedback phases on every step. First, the project manager had to provide feedback and when the implementation was done, the association’s board would give feedback.
Sitemap: Along with the ISN Board, we decided how the sitemap will look like. Main points were non-repetitive of the content and intuitive browsing.
Wireframe: SPX had to create the skeletal framework of a website while we were able to provide feedback. We had live access on what they were creating which helped us move the process faster as we were commenting on every new aspect (screenshots attached). An important aspect of this step was that we had to find ways to keep the detailed content while we are creating a clean website. Drop-down menus were the solution.
Content creation / Collection: The plan wasto include many council members since many of them are chairs to committees that we describe on our website. Therefore, the most time-consuming part of the project since we depended on the responses of other people. Everything run smoothly though since (a) Ats the beginning of the project everyone was aware that will contribute, (b) We sent a personal Word document to each contributor providing the current content, guidelines on what we are requesting from them and some examples, (c) the deadline we gave them was early enough in order to have some time for extension (we did have to do it eventually!). In parallel, we were creating new content while we were discussing it with the ISN Officers.
Visuals & Coding: SPX in parallel was working on the development of the website, while Schmitzmine was adapting the Membership system to the ISN updated brand guidelines and creating the needed connections in order to save time when the website would be ready.
Testing & Feedback: Everything was ready so before the launch of the website we had to test every button, drop-down menu and webpage to make sure that the function properly. At the same time, all Council members had the chance to have a look and send us feedback.
Analytics & SEO: After the final implementation SPX had to connect the website with Google Analytics and make all the arrangements for the use of SEO.
Launch: Our initial plan was to launch the website with the new membership year and be prepared for a new round of feedback / implementation.
Website and membership system
The original ISN website used an iFrame based integration of the Account Handling System (AHS) account and membership system (running on a separate platform) into a Joomla 3.x environment using Javascript and Session- Cookies keeping the login throughout the page.
The Plan
In order to allow a seamless integration keeping the level of responsiveness on all parts of the website and to avoid cross-domain barriers, we decided to switch to a proxy- based integration of the AHS account and membership system. We planned to do a server-side integration within WordPress by extending the Theme of the new WordPress site with our own PHP-based Proxy module which would load the AHS content into the body of a dedicated Wordpress page. For the project, we had a tight time frame of only two months from mid-August to mid-October 2018, and a limited existing in-house experience with Wordpress. The child theme option allowed us to use CSS Styles and Javascript already being used in the main theme - adding separate styles and functions on parts of the website (Account and membership pages) where needed, whereas using the old iFrame solution would have meant completely re-designing hundreds of template files and CSS rules to adapt to one specific design (which was still being developed in parallel to the process).
Personalised members' area, screenshot
The implementation
The implementation showed that where the iFrame was just loading directly and unchanged the content of AHS being presented to the user into the viewport, it had to be parsed by the PHP proxy in several ways:
All AHS-internal links do be remapped to use the base URL of the WordPress proxy-page.
All Javascripts and CCS modules had to be excluded from the existing templates and re-included globally on the page.
To achieve a silent switch between the old and the new website we used the functionality of our template groups to run the system in parallel with two layouts, the one for the old iFrame base website and the new one for the PHP-proxy base WordPress website. During the development phase, we had a parallel copy of the WordPress site as well as a clone of the AHS application server running on separate subdomains.
Innovation
The new ISN platform is fully responsive, suitable for all devices. The website also houses a microsite dedicated to the biennial meeting, removing the need for an additional congress website.
We aimed to provide personalised experiences for each visitor. This is why in the fund webpage, depending on the membership category is possible to see your eligibility among all the fund options ISN provides.
Also, the system that has been used by SPX during the wireframe creation allowed us to see a live version of the website. Since Day 1 of implementation we were able to see live what they were creating, give feedback on that, receive comments on our feedback and see the implementation happen.
Marketing
Strategically the official launch of the website was planned for the opening of the new membership year and 1 month before the official opening of the registration for the Biennial ISN Meeting. Adding this, was that every section of the ISN newsletter was directing to the website. In addition, all our social media accounts focused on the promotion of the new website.
The Marketing plan for the launch of the website was regrettably not used, due to the unexpected passing of the ISN President. A simplified version to celebrate the launch of the website will be initiated during the 2019 ISN Meeting, in Montreal.
Challenges
Timeline: Since the possibility of the extension was not an option (due to new membership year that had to start in November) we had to stick to our project plan and monitor closely the implementation of every step.
Final Product: Combine the expertise and creativity of SPX in hospitality websites and our needs in a website that will cover the needs of our international society.
Stakeholders management: Manage effectively all stakeholders of the project (Website developers, Decision makers, Membership system providers, Content makers)
Membership system implementation:
Client log-in: All front-end scripts previously handling client log-in and session handling on the iFrame based Joomla system needed to be re-written for WordPress and the new proxy-based link system without changing any of the server-side functionality.
Change of scope: With the iFrame all content was local. In contrast with the PHP-proxy all content, including Forms, Javascript and CSS, now was added along with all parts of WordPress globally. For example, the shorthand jQuery ($) notation could not be used in the WordPress context any more. Another issue that needed to be addressed was form control, as some general WordPress forms changed the original order of forms on the AHS pages.
Differentiation between different types of links: Links opening in a separate window like submission forms or information windows need to stay functionally unchanged while still adopting a look and feel of the new website.
ISN website - homepage
Achievements
Thanks to the new website ISN is ready for the years ahead with a user-friendly website, suitable
for the ranging demographic of the neurochemistry community.
We are satisfied that we have achieved all our goals, in the year ahead we will look to further improve the functionalities and where possible reduce the content if we evaluate that there is no interest on the side of the users in it.
Member Experience
Certain pages have been built for each membership type and respective demographic - for example, pages directed to students are more visual and icons have been used to mark the links. On pages often visited by senior professors and emeritus members we used words to signify the links. Subtle, yet effective differences.
Targets & Statistics
Once we launched the new ISN website, the periods that we compared are the following:
One week after the launch, compared to one week before the launch – the blue line shows the week after the launch, compared to the orange (the week before that). It can be clearly seen that there was a great interest by new visitors (826% increase) to see the page and what’s new. Previous users, probably ISN members, also took a look around after the new page was launched too.
Google analytics, website performance 2018 vs 2019
Visitors in 2017 and in 2018 – we also compared the period after launching the new page (Nov 5, 2018 till Jan 31, 2019) with the same period a year earlier. In this period, the new website performs better on all accounts – there is almost 72% in users on the website compared to 2017, there are more new visitors, and the time spent by users is longer than before. As the bounce rate has decreased, it can be concluded that users enjoy the content, which is also easier to find from the previous platform. As Google prioritises mobile-friendly websites, we suspect that this has helped the new website reach more users too.
Financials
The cost for the creation of the website was just under US$10,000, adding to that the cost for the brand revamp and the extra materials resulted to a total cost of USD$15,000, a competitive price due to the nature and competitive market SPX traditionally caters too. The website was delivered under budget and within three months. The return on the investment that we expect is translated into less work on behalf of the secretariat, which will allow them more time to focus on delivering better education for all ISN members.
What would we do differently?
Include the ISN Board earlier in the development process in order to save us some time in the implementation. This so they will understand what the development process entails.
Advice
Logo backgrounds
Start with the Brand Identity. When it is defined, you can start building on this.
Include (minimum) two weeks for feedback after the launch of the website.
Engage the decision makers from the beginning.
Include as many Testing / Feedback periods as possible but make clear what section is being requested to test.
Communicate early with the people that will create content for you
Best time for the launch is when you have the lowest traffic
Feedback & Testimonials
“As a long-standing ISN member I can attest to the huge improvement in the ease of use of the ISN webpage. It is bright, welcoming and informative. I can now effortlessly navigate around all ISN activities, including committees and conference information. I have no doubt this will increase visibility of the society and encourage its growth.”
Professor Michael Cousin, Chair of Neuronal Cell Biology, Centre for Discovery Brain Sciences, University of Edinburgh
“Dynamic, fresh, welcoming, professional. That’s exactly what the ISN website is like and that`s how us young scientists we want to be seen!”
Dr. Eva Blumrich, Postdoctoral Research Fellow, Centre for Brain Discovery Sciences (CDBS, School for Biomedical Sciences)
Wider impact
The new website has reduced the amount of time needed to update and maintain the website. The users/members can find the information they are looking for with ease, not needing to contact the secretariat. There is a clear reduction in emails and a general positive feedback from the community, both from the younger tech savvy researchers and the emeritus members alike.
