Responsive Landing Page - petcare clinic
Responsive Landing Page - petcare clinic
The main goal of the landing page is to build trust quickly and convey a sense of care and warmth that matches the nature of a veterinary clinic serving pet owners
Colors: I used warm shades of orange (#D1684A) to express energy, compassion, and friendliness, combined with soft green tones (#BDC892) to evoke nature, calmness, and health.
This color combination creates a balanced visual experience that feels both lively and comforting ideal for a pet care environment
Layout and Structure: The layout starts with a clear and engaging Hero Section that highlights the main message and booking CTA, followed by sections for services and the veterinary team to establish credibility.
Client testimonials are included to reinforce trust, and a simple booking form at the end encourages quick action with minimal effort
Responsive Design: The responsive version is designed for a 375px mobile width, as it represents the most common device size among users in Egypt
The mobile design prioritizes readability, larger touch targets, and an intuitive vertical flow that keeps key actions (like booking) always accessible
Used a 12-column grid (100px margin, 16px gutter) for desktop to keep a clean, balanced layout
For mobile, used a 4-column grid (16px margin, 16px gutter) to maintain readability and consistent spacing across devices
UX Writing: The copy was written in a friendly and approachable tone that reflects Egyptian users’ communication style.
It aims to make users feel comfortable and cared for while maintaining professionalism and trust
Full Version 👇:
Tools used
From brief
Topics
Share
Reviews
4 reviews
The layouting is good but the colour combination and content hierarchy can be better
Needs some improvement on the interface, but good job. Keep going!
I can see you've put work into this project. The color palette builds a warm atmosphere, and your grid choice is sensible. I appreciate that you considered the local market and adjusted the resolution for Egyptian users.
However, there are critical issues. The biggest problem is readability – text is too small and cramped, especially on mobile. Typographic hierarchy gets lost, making it hard to identify what's important. The contrast between light text and beige background in the form section won't pass accessibility tests.
I don't see a clear primary call-to-action. Green buttons get lost in the text when they should guide users toward booking. The services section overwhelms with too much information at once. The testimonial carousel navigation is too subtle, and the form at the end is lengthy – consider breaking it into steps.
On mobile, spacing between sections is uneven and illustrations consume too much space. I don't see how the hamburger menu works, which makes evaluating the full flow difficult.
What's missing: the actual user journey through booking, interactive states like hover or error, and real content in places where I see placeholders.
The project has potential but needs work on fundamentals – readability, contrast, and communication clarity. 👏😊
What an inspiring and beautifully crafted project! It’s the kind of work that motivates others, including me, to create something meaningful.
You might also like
Wireframing for Video Streaming Service
Settings Mobile Page
Flash: AI Study Companion⚡
Financial mobile app
LinkOn Profile Page
Owlyread-Reading app
Visual Design Courses
UX Design Foundations
Introduction to Figma
Design Terminology
