DRIME is a responsive, multilingual, interactive, and embeddable video player without cookies. It consists of two main applications: the Drime player with its associated DRIME video format, and the Drime video editor.
The .drime format is a JSON-based format that enables video playback in multiple languages chosen by the client, with subtitles, voiceovers, and dynamic designs tailored to each language—all using a single video file. This setup reduces time, storage costs, and the ecological footprint associated with file storage, as only one video is hosted regardless of the number of languages, with one Drime file created per project.
1/ The Drime player and .drime file format:
- For professionals/clients:
Video tutorials are shot by the DRIME team and optimized for playback across all screen resolutions.
Features include broadcasting in multiple languages using voiceover, subtitles, and dynamic designs available in all selected languages, along with voice commands. Tutorials or manuals can also be broken down into steps for step-by-step viewing.
In addition to its video library accessible on the DRIME platform, clients can embed individual videos or their entire library on their web page or other sites through iframes (indexed by Google).
The platform also includes a dashboard with Drime "Smart Indicators," user rights management, custom iframes, and QR codes. Dynamic video designs will soon be available.
- For users:
A video playback platform that adjusts to screen resolution, with options for "step-by-step" or continuous playback, voice commands, sound and subtitle settings, and language selection. By default, videos are displayed in the user's browser language when available, or in English otherwise.
Projects carried out:
- Developed each new feature: Frontend and Backend,
- Player redesign: added persistent sound and subtitle settings, implemented CSS and Lottie animations for buttons, created step counters in step-by-step videos, improved voice commands,
- Homepage redesign with Lottie animations and menu creation,
- Patched the video creation system, which crashed with over five videos, by implementing a job for creating multilingual videos. Later, redesigned the video creation system for scalability,
- Created a new library type, redesigned the old library, and prepared the model for scalability to adapt to custom client designs,
- Developed "smart indicators" including a library dashboard, rankings, graphs, averages, and percentages,
- Fully redesigned the user rights and favorites management system with a mini search engine by email,
- Created a custom iframe generator allowing logo, banner, menu, filters, forced language, and smart indicator code copy,
- Built a custom QR code generator with options for color, background color, size, format, smart indicator, and download,
- Redesigned error pages, and created static pages for pricing, legal notices, and privacy policy,
- Redesigned registration and login pages,
- Implemented multilingual dynamic video designs,
- Developed a super admin dashboard enabling the creation and modification of design types, allowing JSON files for animations to be created, read, and edited directly,
- Created a second landing page.
Technologies used:
Figma, Ruby on Rails, Vanilla JS, ES6, jQuery, JSON, HTML, CSS, SCSS, PostgreSQL, SQL, Heroku, AWS, Git.
2/ The Drime video editor:
The Drime video editor is distinct from the basic player. It enables clients to create a slideshow from short videos and/or photos with customizable transition effects. Like the Drime player, it is multilingual, responsive, interactive, embeddable, and lightweight.
With preselected media and text, clients can create and publish a video in about five minutes. Adding another language (voice-over, subtitles, etc.) takes just two more minutes. Logos and soundtracks can also be added.
In summary, with a bit of preparation, a multilingual video can be created in ten minutes and immediately available online. The video can then be exported via iframe, a single line of code for embedding, or as a showcase on the Drime platform.
Projects carried out:
- Set up the project on Heroku,
- Installed the project on GitHub,
- Created a third landing page with animations, including a video timeline that unfolds with scrolling, parallax, and other effects,
- Built the Drime video editor from scratch (Frontend and Backend),
- Implemented standard static pages for the application,
- Created a Super Admin area for managing clients and their projects,
- Developed a client area where clients can list, create, modify, duplicate, publish, and delete projects,
- Automated reading and writing of required Drime files on AWS for storage,
- Enabled user project creation, Drime file creation, and management of video statuses (temporary, draft, and published),
- Set project options, including editing choices, designs, and focus for responsive mode,
- Enabled real-time previews of all effects upon selection,
- Integrated voice-over generation via Azure Text to Speech API, with options to modify and delete,
- Configured voice choices with gender and region filters, allowing users to sample each selected voice in a personalized Drime sample translated into all languages,
- Enabled modification of specific words or phrases to adjust pronunciation in voice-overs,
- Added, modified, and deleted languages for projects,
- Configured translations using Azure Translate API, with options for manual customization by the client,
- Enabled project preview before publishing and draft saving,
- Transferred the project to GitLab, Docker, and AWS, in collaboration with an independent architect who built this new environment,
Technologies used:
Figma, Ruby on Rails, Vanilla JS, ES6, jQuery, JSON, HTML, CSS, SCSS, PostgreSQL, SQL, Heroku, AWS, Azure APIs, Git, GitHub, GitLab, Docker.