React.js
/
Next.js
/
React Native
/
Expo
/
iOS & Android
/
HTML 5 + CSS3
GDCh.app – App for the German Chemical Society
How we developed an App for +30,000 chemists
Overview -
The GDCh.app
It’s mid 2020 and the GDCh is on a quest: to find the perfect partner to create their GDCh.app – a digital beacon project for the renowned German Chemical Society.
Client
German Chemical Society e.V.
Services
UX Design
/
UI Design
/
Web development
/
App development
Duration
7 Months
The team
1 Project Manager
/
2 Front-end
Engineers
/
2 Back-end
Engineers
/
1 UX Designer
/
1 Visual Designer
Challenges & goals
The memo was clear – we had a year to create the GDCh.app to positively impact the more than 30,000 international GDCh members. News, articles, and social media from various channels and systems had to be incorporated into the app. Members can create profiles and find their colleagues on the app, which needed to be available on the Internet, App Store, and Play Store.
Our approach
Due to the complex and multi-layered technical and content-related requirements of the GDCh, we initially advised carrying out a UX and concept workshop. The aim was to fix the final feature set with all stakeholders and lay the foundation for a successful IT project.
30k+
Registered users in Germany and worldwide
8+
Supported platforms and device types
7
Especial dreamteam employees
0
Planned maintenance hours / month
Roadmap -
How we developed the App
Together with the stakeholders, we run through the Concept Phase of establishing wireframes and developing features in Design Sprints or UX Workshops. The wireframes are then refined in Visual Design in terms of color and aesthetics, and ultimately converted into program code.
Concept & UX Design
Visual Design
Programming
Concept & UX Design -
What do users want
Together with the stakeholders, we run through the Concept Phase of establishing wireframes and developing features in Design Sprints or UX Workshops. The wireframes are then refined in Visual Design in terms of color and aesthetics, and ultimately converted into program code.
01 Great content at the palm of their hand
The GDCh provides diverse and quality content for the chemical community and those interested in chemistry. Integrating their member’s magazine as a bookshelf, and numerous articles from other platforms like Typo3 and Twitter needed to be readily available in the app. The aim was for the content to be easy to access and share – so we incorporated push notifications, bookmarks and sharing options.
02 The Social Butterfly
An easily mapped out social network is vital for users of the GDCh.app. Members should be able to share their interests, their specific field, and profile bio. Upploading a profile picture and linking to other social networks such as Twitter and LinkedIn were also part of the requirements.
03 Easy Access – App & Web
Available at your fingertips. The GDCh.app needed to be effortlessly accessible whether the user was in the office, the laboratory, the breakfast table, in the train to the university campus or simply on-the-go. With these requirements in mind, a multi-platform app was created with full functionality on both the Web, as well as on desktop PCs, notebooks, tablets, and smartphones.
04 Elearning, ecommerce and so much more!
Always looking ahead. As the digital beacon project, thinking long-term was important. The GDCh.app needed to have the bandwidth of incorporating future ideas like integrating training offers or the career service. The design, the system landscape and the technical structure of the app needed to be equipped to handle these potential changes.
The way we work is unique and extremely effective.
Within only a few short weeks we had completed the Concept Phase. We had agreed on the vision of the app with all stakeholders, analyzed the data structure and developed a clickable prototype. The prototype we created served as the perfect visual for the GDCh to make their final conceptual changes.
Within only a few short weeks we had completed the Concept Phase. We had agreed on the vision of the app with all stakeholders, analyzed the data structure and developed a clickable prototype. The prototype we created served as the perfect visual for the GDCh to make their final conceptual changes.
Visual Design -
A Modern Look
Once the Concept Phase is completed, we further explore and develop the Visual Design. This is where we implement the visual and aesthetic refinements to the GDCh.app.
We received a general outline in terms of style from their existing corporate design. We needed to create a modern layout for the social media components. We had to strive for an app that delivered a seamlessly enjoyable reading experience. For example, with users being able to adjust the font size on the app.
We had our work cut out for us, and we couldn’t wait to solve these technical obstacles for our client. The GDCh.app was designed as an app for iOS, Android, and the Internet. We needed to re-arrange the design to include users on desktops PCs, tablets and smartphones- which is exactly what we stylishly did.
→ Programming (Front-end) - Flexible Efficient & Scalable
01 Simplify with headless e-commerce
Thanks to an API-based approach, the front-end technology is compatible with data of varying quality, origins, and languages. It is not tied to a specific CMS thereby syncing with new systems with little effort – making everyones’ lives easier.
02 State of the Art Performance
The utilized front-end technologies, such as State Site Generator, afford download speeds that offer those on the move the best results, as attained in Google Lighthouse and Google PageSpeed. Integrated social media tags make it easy for GDCh.app users to share content on various social media platforms and within the company.
03 We speak: NEXT LEVEL CODE
Usually, a combination of various programming languages and systems have to be used for the Web, iOS, and Android. However, by using the latest technologies, we were able to create a code that works for all three platforms simultaneously. This greatly reduced development and future maintenance costs.
04 Floating on a Cloud
The cloud has simplified things. Gone are the days of complicated hosting and maintenance contracts. We have proven that through using the most modern cloud infrastructure from AWS and Vercel, both the front-end and back-end (see below) require little maintenance and run at minimal cost.
→ Programming (Back-end) -Microservices powered by The Cloud
A combination of 7 back-end microservices were developed, which run automatically and are responsible for updating and upgrading the data for members, articles, images, videos, login, push notifications, authors and much more. Due to a distributed cloud-based microservice architecture, these services are autonomous, fail-proof and easily scalable.
Front-end
Back-end
GraphQL
/
Node.js
/
Vercel
/
Hygraph
/
Serverless Functions
Outcome & outlook -
Digital Future, we’re ready for you
This traditional Chemical Society needed an app that they could easily take with them into the digital future. With a largely cloud operated infrastructure, we created a forward-thinking, flexible GDCh.app that can be updated to include additional services in a matter of only a few weeks.
30k+
Registered users in Germany and worldwide
8+
Supported platforms and device types
7
Especial dreamteam employees
0
Planned maintenance hours / month
Client reference -
Agile & flexible service
“We chose Especial for 2 reasons: On the one hand, they are very familiar with the JAM stack that we want to rely on in the future. On the other hand, they offer fair billing based on work done in the project phases – agile and flexible service. I always look forward to our weekly meetings.”
- Dr. Maximilian Bräutigam,
Chief Digital Officer at GDCh
1 Call
a week is enough to solve even the complex issues
All Goals
were achieved. We delivered on time and within budget
