Product identity · UX/UI · Web development

Dermaexel Anti-Estrias

Exelderma · Dermocosmetics

A product-extension MVP that translated Dermaexel’s scientific positioning into a distinctive packaging identity, a responsive information platform and a coherent launch communication system.

Dermaexel Anti-Estrias product tube and packaging in a bathroom setting
The project

Dermaexel Anti-Estrias was developed as a new dermocosmetic product within Exelderma’s portfolio. The challenge was to extend the established Dermaexel identity into a focused anti-stretch mark proposition without losing the credibility, visual discipline and sense of safety already associated with the parent brand. The formula brings together the Growth Factors Complex, hyaluronic acid and vitamin C in a three-part product story that needed to remain understandable and consistent across packaging and digital touchpoints.

The engagement began with a product mockup and evolved into a launch-ready system for a product that Exelderma subsequently introduced to the market. Information architecture, mid-fidelity wireframes and responsive UI components were used to organise product information, causes and prevention, scientific studies, documented results, contact routes and purchase paths into a clear user journey.

The digital experience was connected to the existing social channels and the online store established during the first Dermaexel project. Implementation covered a PHP-based web environment using HTML5, CSS3, JavaScript, MySQL and phpMyAdmin, together with hosting preparation, cPanel configuration, DNS records, FTP deployment, HTTPS/SSL and production-environment setup.

UX/UI process

Structuring scientific content before visual polish.

Mid-fidelity wireframes defined hierarchy, navigation, content relationships and the primary user flows before colour, imagery and brand components were introduced into the final interface.

Dermaexel Anti-Estrias mid-fidelity website wireframes
Responsive experience

A responsive product platform built around clarity and trust.

The final website organises the product’s three core components, information about stretch marks, scientific studies, visual results, contact and purchase paths in one coherent experience across desktop, tablet and mobile.

Dermaexel Anti-Estrias responsive website interface
Technical implementation

Infrastructure and implementation prepared for reliable operation.

The scope covered front-end delivery, server configuration, database administration and deployment, allowing the design to operate as a real product platform rather than an isolated visual prototype.

HTML5 + CSS3 + JavaScriptResponsive interface, semantic structure and interactive behaviour
PHP + MySQLServer-side processing and structured content data
phpMyAdminDatabase administration and environment control
cPanel + DNS + FTP + SSLHosting, deployment, domain records and HTTPS configuration
Launch communication

Launch communication extended the product system across channels.

Campaigns, webinar assets, official market announcements and promotional content were created with the same visual hierarchy as the website and packaging, supporting consistent recognition across social and commercial touchpoints.

Dermaexel Anti-Estrias social media and launch campaign materials