Design for Luxury Custom Vans
458 USD
niche: premium customization of minibuses (minivans)
Goal: to create a high-conversion, highly dynamic, and "expensive" looking website with an interactive 3D configurator.
Important: all technical details, content, new references, styles, and animations can be clarified and improved during discussions and agreements with the client. When developing, it is necessary to consider the data from the questionnaire, which contains all the key information about the client's preferences and expectations for the future website.
Stage 1. Wireframe / prototype
1. Stage goal
Create a detailed structural layout (wireframe/prototype) of all website pages to work out the logic of navigation, user scenarios, content placement, and key interactive blocks.2. Tool and submission format
- Figma
- Clickable prototype or static screens + PDF export with explanatory comments for each screen
3. Main requirements for the prototype
- Clear grid and hierarchy of blocks;
- Designation of areas for the embedded 3D module (container, UI control elements: rotation, zoom, auto-rotation);
- Logic of dynamic cost calculation (block "Final Price") with visual updating of the amount when selecting options;
- Development of the user path across all sections and screens;
- Adaptation of key screens: desktop + mobile;
- Explanatory comments for each screen (purpose of the block, example content, priority of elements).
4. Website structure and key blocks
4.1. Common elements of all pages
- Header: logo, main menu (including items "Configurator" and "Custom version"), clickable phone, "Order a call" button, burger menu for mobile.
- Footer: contact form (name, e-mail, phone), links to social networks, copyright, and additional links (privacy policy, etc.).
4.2. Main page
| Block | Description |
|---|---|
| Hero section | Video/static background + slogan + 3 CTA buttons ("Learn more", "Configurator", "Custom version"). |
| Advantages | 3–4 icons with key USPs ("Premium materials", "Individual approach", "Guarantee"). |
| Service announcement | Cards of main services (icon + title + brief text). |
| Work procedure | 4 steps visually (Choose model → Design project → Production → Delivery). |
| Portfolio preview | Slider of completed cases with hover effect and brief description. |
| Client reviews | Slider/grid with quotes and photos of clients. |
| About us block | Brief information about the company, values, team (illustration/photo). |
| Partners | Logos of partners/brands in a carousel. |
| Final CTA | Call to action ("Schedule a consultation" or "Leave a request"). |
4.3. "About the company" page
| Block | Description |
|---|---|
| Title + subtitle | "About us" – mission, brand philosophy |
| History / key facts | Timeline or separate "key facts" |
| Team | Photos and names of key specialists |
| Our values | Icons + captions |
| Production capacities | Gallery of workshops/offices |
| CTA | "Contact us" button |
4.4. "Services" page
| Block | Description |
|---|---|
| Title + introductory text | "Our services" – brief information about areas of work |
| List of services (cards) | Customization, 3D configurator, anti-gravel, detailing, wrapping |
| Detailed description (accordion) | Expanded descriptions of each service + examples of work |
| CTA | "Order a service" |
4.5. "Cars to order" page
| Block | Description |
|---|---|
| Title + slider | Examples of finished minibuses |
| Order placement procedure | 3 steps: "Request" → "Contract" → "Implementation" |
| Gallery of cases with filters | Filtering by model/year/status |
| CTA | "Leave a request" |
4.6. "Portfolio" page
| Block | Description |
|---|---|
| Title + introductory text | "Our works" |
| Grid of cases with filters | Photos of projects with hover description |
| Detailed case page | Gallery, project history, technical details |
4.7. "Blog / News" page
| Block | Description |
|---|---|
| List of articles (cards) | Date, category, title, short announcement |
| Filters / pagination | By categories (news, cases, tips) |
| Detailed article page | Photo-title, text, gallery, links to similar materials |
4.8. "Contacts" page
| Block | Description |
|---|---|
| Title + subtitle | "Contact us" |
| Feedback form | Fields: name, phone, e-mail, message |
| Map | Embedded map (Google Maps or similar) |
| Addresses and phones | List of offices/workshops |
| Social networks | Icons-links to messengers and social networks |
4.9. "Configurator" page
| Block | Description |
|---|---|
| 1. Model selection | Grid of available minibuses: photo + key parameters (year, configuration, starting price). |
| 2. Color and interior finish | Gallery of materials (leather, alcantara, wood) with preview in mini-model. |
| 3. Cabin layout | 3 fixed options (2+2, 2+3, "VIP sofa") + button to switch to "Custom version". |
| 4. Additional options | Lighting, refrigerator, audio system, tables, etc. — each option with price indication. |
| 5. Custom version | Separate screen "Custom version" — free configuration of all parameters (colors, layout, options), packages, and prices above standard. |
| 6. Final cost | Dynamic block "Final Price": the amount increases animatedly when adding options. |
| 7. View result |
• "Photo cases" block
• "Video cases" block |
Stage 2. Final design in Figma
1. Stage goal
Based on the approved prototype (Stage 1), create a complete, dynamic, and "expensive-looking" UI design for all website pages in Figma with educational animations and micro-interactions.2. Input materials
- Approved wireframe/prototype (result of Stage 1)
- Brand guide (logo, corporate palette, fonts)
- References and competitor websites
- Client questionnaire with key information about preferences and expectations
3. Main tasks
| № | Task |
|---|---|
| 1 | Visual style: develop premium typography, select an "expensive" color palette, light and shadow effects. |
| 2 | UI components: design buttons, cards, forms, icons, tables, modal windows, etc. as Figma components. |
| 3 | Screens: visualize all pages according to the structure of Stage 1, including "Configurator" with 3 layout options, Custom version, and dynamic estimate. |
| 4 |
– Prototype hover effects and transitions;
– Parallax micro-animations and video blocks in hero sections;
– Animation of number growth in the "Final Price" block;
– Animation of interaction with the 3D block (appearance of controls, smooth rotation inertia). |
| 5 | Responsiveness: layouts for Desktop / Tablet / Mobile considering touch interactions for the 3D module and responsive animations. |
| 6 | Figma Library: compile Color Styles, Text Styles, Effects, and components into a common library for handover to development. |
4. Design requirements
- Maximum dynamics: expressive animations, video background, micro-interactions.
- Premium look & feel: clear play of light/shadow, airy compositions, high-contrast "expensive" style.
- Unified UI/UX system across all screens.
- Focus on content: the 3D module and multimedia cases should occupy a key place in the visual flow.
Client's review of cooperation with Alena Arutyunyan
Design for Luxury Custom VansWorking with Alena was a real pleasure! She deeply immersed herself in the task, thoroughly analyzed competitors' websites, and proposed several strong concepts, from which we together chose the most suitable one. As a result, we ended up with a modern, meticulously crafted design that perfectly reflects the character of our brand and effectively addresses all the business objectives set.
Each stage of the collaboration was accompanied by clear and coherent explanations: Alena agreed on deadlines in advance, showed intermediate sketches, and made adjustments to accommodate all our wishes. I was especially pleased with her ability to anticipate nuances that we sometimes overlooked: well-thought-out navigation elements, text readability, harmonious color schemes, and layout adaptation for mobile devices.
I would like to specifically thank her for her promptness and friendliness – communication with Alena was always comfortable, and feedback came instantly. I recommend her as a highly professional designer who values her reputation and brings projects to perfection!
Freelancer's review of cooperation with Konstantin Pavlovich
Design for Luxury Custom VansWorking with Konstantin was very pleasant - clear task setting, quick responses, and constructive feedback. From the very beginning, there was an understanding of the project's goals, which allowed for quick solutions and progress without unnecessary approval cycles.
Konstantin respected my suggestions, but at the same time provided valuable comments that helped improve the final result. The project went smoothly, productively, and in a true partnership format.
Thank you for your trust - I would be happy to collaborate again!
-
40 days602 USD
146 40 days602 USD
Good day!
We are a studio specializing in premium design and high-conversion website development.
Design and development will be done.
Payment can also be made to an individual entrepreneur with a contract.
We can arrange a call with our technical specialist to discuss all the details.
We take into account all client wishes and offer solutions that enhance the effect.
We are ready to discuss the details and get started!
-
3 days25 USD
4833 19 0 3 days25 USD
Good day! I am ready to complete the work with high quality.
My portfolio of works is in my profile.
Thank you in advance!
-
Winning proposal15 days458 USD
53358 538 0 Winning proposal15 days458 USD
Good afternoon
I will be happy to help you with the prototypes
Thank you for your cooperation
Current freelance projects in the category HTML & CSS
Optimization of WordPress site speed
113 USD
We will send full details in private messages Goal Maximize website loading speed, especially on mobile devices. KPI (mandatory) After the work is completed, the following metrics must be achieved. Mobile Performance 90+ LCP less than 2.2 sec INP less than 200 ms CLS less than… HTML & CSS, Javascript and Typescript ∙ 14 hours 43 minutes back ∙ 43 proposals |
Create a website and connect it to Shopifyto create a website and connect it to Shopify the main page is in the mockup there will be no product pages, there will be a modal window for selecting the size of the cream jar and its quantity after that, a delivery and payment window the order must be sent to Shopify with… HTML & CSS, Web Programming ∙ 17 hours 30 minutes back ∙ 57 proposals |
Website optimization
Optimization of the website jdgreta.co.uk on Shopify. SEO audit attached to the project. Main tasks - - Fix all meta data - Complete the technical specifications for the programmer (since this project combines tasks for both the programmer and SEO, if you are not a company -… HTML & CSS, PHP ∙ 1 day 18 hours back ∙ 30 proposals |
Transfer of the website to Shopify
We need to migrate the current website jdfurniture.uk from OpenCart to the Shopify platform. The current OpenCart site generally meets our needs in terms of structure and functionality. The main reason for the migration is issues with payment systems. There should be no such… HTML & CSS, Web Programming ∙ 2 days 11 hours back ∙ 40 proposals |
Transfer of design to WordPress
45 USD
Good day! It is necessary to transfer the finished design of a one-page landing page to WordPress. The layout is fully ready (Figma), no design development is needed. It is required to code the page quality, adapt it for mobile devices, and set it up on WordPress. Please… HTML & CSS ∙ 2 days 17 hours back ∙ 106 proposals |
Kyiv