We tried to establish a design system by concluding basic elements and components, to deliver better and more consistent design solutions efficiently and provide clarity to engineers.
We selected colors that can work well in both dark and light modes. The red was used as the primary color, and others are supporting colors. The bright colors which highly contrast with background can improve readability and accessibility.
We selected PingFang SC as our typeface due to its clean and elegant appearance. In addition, the typeface is multilingual support, including English, and Simplified Chinese, which could help construct a global design system.
We audited widely-used screen size to ensure consistency across layouts. Then, we defined responsive grid systems that adapts to these screen sizes. The entire layout is based a flexible grid that allows for a variety of different widgets sizes.
We created the visual representation of how the product will work and showcase clients a clear understanding of how the product will function.
The homepage is curated to integrate TikTok, Xigua Video and Toutiao, inspiring users to explore and generate content. Here users can discover interesting video stories and listen to up-to-day news. Users can also create and share videos by easy-to-use video creation tools.
The Audio content enables drivers who need to keep their eyes on the road but still want to access news or other information. The platform provides various topics, ranging from sports and entertainment to agriculture and history. The filter on the left side help users to quickly find audios they are interested in.
The Video players are designed consistently with their mobile applications. Users can browse and watch curated content uploaded by other users. They can also follow other users and receive updates. The platforms also support “like” and “comment” actions, which engage passengers with video content in a social and interactive way.
The platform allows users to follow other creators and see their contents. Users can also see their own collected and liked videos on their profile page. Additionally, users can interact with other users' content by liking, collecting and following their videos.
The search engine can be accessed by tapping on the magnifying glass icon located on the top left of the homepage. From there, users can type in keywords or phrases to search for relevant videos, audios and users. The search engine also offers various filters and categories to help users refine their search results.
The Sign-in process here is fast and comfortable. Users can quickly log in via their Tiktok accounts. Users can also log in with their phone number and verification code.
Volcano entertainment system has several privacy and settings features that allow users to control their privacy and security. Users can choose to enable or disable accounts based on their personal preferences.
Based users’ different preferences when it comes to reading text on screens, we designed both dark and light mode, and also provided users with a choice in how they interact with the interfaces.