The project is still WIP. I can share some details though!
The web-app „Lübz Liefert“ has the purpose of creating a channel for communication between local companies and their consumer base. The initial website was just a business-card like index service for companies, so they could be discovered. But we wanted more than that.
The landing-page needed to fulfill 3 fundamental criteria.
Both animations are created with a mixture of Blender and After Effects. 2D stuff like the animated screen in the top animation, or the moving text in the bottom one is done in After Effects.
The hands itself, the movement and everything the hand holds or interacts with were made in Blender. I modeled and then rigged the hand, so I could animate it. The lighting is key in short animations like this. I placed an HDRI for the general “real-like” environment lighting in the scene, and then added a light source which technically sits in the middle of the screen when the animations are placed. That gives them a connection, additionally to the consistent art-style.
Once the user is securely logged-in (either by signing up directly or using Google to log in), they see a list of every participating company. There are direct links of each company, going to their website, email, telephone, WhatsApp etc. The user can also subscribe to a company. They then see and get notified for every new announcement/message by the company. Every message also gets assigned one more multiple categories. Those can also be subscribed by the user. For example, I am interested in smart-home stuff, so I could subscribe to that category and get a notification every time a company has something going on in that sector.
The app is built in Vue.JS. That ensures a smooth and almost app-like experience for the user.
I will not go too much into detail here, so the user’s safety is ensured.
The backend is a Rest API made in PHP and communicating with a MySQL database. After realizing the complexity of the API, I am restructuring it into a GraphQL API. The login-security is ensured with an 256bit login-token. So even in the unusual case where someone changes the login-information in the front-end, he will not get far, because guessing that token would be impossibly unlikely. All data then gets loaded on demand. The data is then stored in a VueX store, rapidly accessible by all components in the app.