A clean, minimal order tracking section UI. Include a bold headline saying "Sifarişinizi izləyin", a short descriptive paragraph under it explaining the purpose: "İzləmə kodu vasitəsilə sifarişinizin hazırkı mərhələsini real vaxtda yoxlayın. İstehsaldan qablaşdırmaya qədər olan bütün mərhələlər bir baxışda əlinizin altındadır.", then a search input with a placeholder "Məsələn: 0000003" and a red button labeled "Axtar". Use modern card-like design, rounded corners, spacing, and shadow. Responsive layout, suitable for mobile and desktop. Azerbaijani language.
i upload current design in this message
I'll create a clean, modern order tracking section based on your requirements, with improvements to the current design while maintaining the Azerbaijani language content.
I've created a clean, modern order tracking section with the following features:
- A bold headline "Sifarişinizi izləyin" as requested
- The descriptive paragraph explaining the purpose in Azerbaijani
- A search input with the placeholder "Məsələn: 0000003"
- A red button labeled "Axtar"
- Modern card design with rounded corners, proper spacing, and shadow
- Responsive layout that works well on both mobile and desktop
- Search icon inside the input field for better visual guidance
- Clean typography with proper spacing between elements
The design maintains the Azerbaijani language content while providing a more polished and modern look compared to the current implementation. The card-based layout gives it a clean, contained appearance that stands out on the page.
this design is very simple can we improve this design
I'll create a more visually appealing and engaging design for the order tracking section while maintaining its functionality and the Azerbaijani language content.
I've significantly enhanced the design with the following improvements:
Visual Enhancements:
- Two-column Layout: Added a visually appealing split layout with the tracking form on the left and an illustrative example on the right
- Gradient Text and Accents: Used gradient text for the heading and a small accent line for visual interest
- Interactive Elements: Added hover animations on the search input and button
- Soft Shadows and Glows: Incorporated subtle background glows and shadows for depth
- Status Visualization: Added a sample order status display with icons and timeline
- Micro-interactions: Included subtle animations on hover for better engagement
- Improved Typography: Enhanced text hierarchy with better font sizing and spacing
Functional Improvements:
- Visual Feedback: The search bar now has a subtle animation when hovered
- Example Display: Added a visual example of what tracking results might look like
- Trust Indicator: Added a small verification message with a checkmark icon
- Larger Touch Targets: Increased the size of interactive elements for better usability
- Better Visual Hierarchy: Improved the organization of information with clear visual cues
Design Elements:
- Color Palette: Maintained the red theme but added complementary colors for better visual interest
- Icons: Added relevant package tracking icons from Lucide React
- Card Design: Enhanced card design with gradients and better spacing
- Background: Added a subtle gradient background to the page
- Rounded Corners: Used more generous border radius for a modern look
This design is much more visually engaging while maintaining the clean, modern aesthetic and all the required Azerbaijani language content.