01 / Overview
One website, one clear story.
Renty Power is a portable power-bank rental service in Spain. Users can find a nearby station, rent a battery, pay digitally, use it when they need it, and return it afterwards.
The website had to make that unfamiliar service easy to understand while also creating enough trust for someone to take the next step and download the app.
How do you explain a new service quickly, make the experience feel trustworthy, and move visitors from understanding the product to taking action?
02 / My role
From research to responsive UI.
UX/UI Designer - responsible for the end-to-end website design.
I worked across the full website journey, from early research and information architecture to wireframes, visual design, responsive layouts, reusable components, and supporting product explorations.
- Competitive and visual research
- Sitemap and content hierarchy
- Wireframing and conversion flow
- Responsive desktop, tablet, and mobile UI
- Design-system foundations and reusable components
- Product mockups and promotional explorations
03 / Process
Building the experience from structure to screen.
-
01
Research the visual territory
I explored charging, technology, SaaS, startup, and consumer-product websites to understand patterns around product presentation, trust, motion, device mockups, and conversion.
-
02
Structure the story
I mapped the sitemap and long-form homepage around the questions a first-time visitor would have, defining the content hierarchy, navigation, sections, CTAs, forms, and supporting information.
-
03
Wireframe the journey
The wireframe established the order of the homepage before visual styling: introduce the product, explain it, present the benefits, build credibility, answer questions, and create repeated opportunities to convert.
-
04
Develop the visual system
I established the neon-green and dark visual language, typography hierarchy, color ramps, sizing guidance, and reusable UI properties before applying them across the page.
-
05
Adapt rather than shrink
Desktop, tablet, and mobile were treated as distinct layouts. Sections were reorganized where needed so hierarchy and interaction remained clear at each breakpoint.
04 / Design decisions
Designing for understanding first.
Lead with the core value proposition
The hero is built around the message “Baterías portátiles cerca de ti.” The goal is to communicate the service immediately rather than making visitors work through a long introduction.
Why: A new category needs clarity before detail. The app-download CTA is introduced early so the primary action is always visible.
Turn the service into a simple journey
The product is explained through a clear sequence: find a station, rent a battery, charge your device, and return the battery.
Why: The process answers the most important first-time-user question - “What actually happens when I use this?”
Use proof throughout the page
Testimonials, app ratings, Trustpilot patterns, usage metrics, FAQs, and support information are distributed across the experience instead of relying on a single trust section.
Why: Credibility is part of the conversion journey, especially when the service may be unfamiliar to the visitor.
Create energy through contrast
The visual identity combines neon green with dark surfaces, gradients, product imagery, and motion-inspired graphics. Helvetica Now is used for display content and Poppins for body and interface text.
Why: The system gives the brand an energetic technology feel while keeping the information structured and readable.
05 / Challenges
Where the design needed the most attention.
Explaining an unfamiliar service
The website needed to explain portable battery rental without assuming prior knowledge. The content hierarchy therefore moves from the problem and value proposition into the actual rental process before asking for action.
Balancing information and conversion
The homepage includes features, testimonials, ratings, FAQ, blog, contact, newsletter, legal navigation, and multiple app-download moments. The challenge was to keep the page useful without losing the primary conversion goal.
Making responsive layouts feel intentional
The desktop composition could not simply be scaled down. Tablet and mobile required changes to stacking, spacing, hierarchy, navigation, and content density while keeping the same overall story.
06 / Reflection
The work behind a simple-looking experience.
The biggest lesson from Renty Power was that a marketing website is not just a collection of polished sections. The sections have to work together as a story.
The strongest part of the final direction is the progression from understanding to confidence to action: introduce the service, show how it works, explain its benefits, provide proof, answer uncertainty, and return to the app as the next step.
The project also pushed the responsive work beyond simply resizing a desktop composition. Each breakpoint was treated as part of the same experience, but with its own layout decisions.
The Figma file contains the complete responsive homepage, a full desktop wireframe, multiple visual iterations, section explorations, promotional scenes, mockups, archived alternatives, and reusable design-system components.