Pro Theme Image Guide for Banners and Layouts

Introduction

The Pro Theme by UPayments transforms the eCommerce experience, providing merchants with visually appealing and highly customizable layouts to highlight their brand and products. This guide serves as a simplified yet comprehensive resource for preparing banners that align with the theme’s design requirements. Additionally, it includes recommendations to inspire merchants on effective usage for each banner type.

Pro Theme Banner Types and Specifications

1. Business Logo

• Purpose: Represents the business across all layouts and enhances brand identity.

• Recommendations:

  • Use a clean and professional logo for a polished look.

  • Opt for a simple design that remains legible in different sizes.

• File Requirements:

  • Dimensions: 1080 x 1080 pixels

  • Formats: JPG, JPEG, PNG

2. Carousel Banners

• Purpose: Rotating banners designed to engage users with visually striking campaigns.

• Layout Options: Standard, Classic, Trendy

• Recommendations:

  • Use to feature new arrivals, top-selling products, or seasonal promotions.

  • Include a call-to-action such as "Discover More" or "Shop Now."

• File Requirements per Carousel:

  • 1x English Desktop: 1800 x 800 pixels

  • 1x Arabic Desktop: 1800 x 800 pixels

  • 1x English Mobile: 480 x 275 pixels

  • 1x Arabic Mobile: 480 x 275 pixels

  • Formats: JPG, JPEG, PNG

3. Sale Banner

The "Sale Banner" has varying requirements depending on the layout.

• Standard Layout Sale Banner:
  

  • Purpose: Carousel of mini Banners

  • File Requirements per carousel:

    • Desktop: 580 x 360 pixels

    • Mobile: 450 x 150 pixels

  • Recommendations:

    • Use vibrant colors and bold text to catch attention.

    • Highlight limited-time offers with countdowns or urgency-driven language.

• Classic Layout Sale Banner:
  

  • Purpose: Features two square banners alongside one wide banner for dynamic sales campaigns.

  • File Requirements:

    • Wide Banner:

      • Desktop: 1078 x 425 pixels

      • Mobile: 470 x 232 pixels

    • Square Banner:

      • Desktop: 425 x 425 pixels

      • Mobile: 232 x 232 pixels

  • Recommendations:

    • Utilize the wide banner for main sales and the square banners for complementary promotions.

    • Incorporate contrasting elements to differentiate product categories.

4. Special Sale Banner

• Purpose: A wide, page-spanning banner for major announcements or exclusive offers.

• Layout Options: Standard, Classic, Trendy

• File Requirements:

  • Desktop: 1800 x 570 pixels

  • Mobile: 450 x 180 pixels

  • Formats: JPG, JPEG, PNG

• Recommendations:

  • Use for flagship product launches or special events like Black Friday.

  • Ensure minimal text with a focus on bold visuals.

5. Flash Sale Banner

• Purpose: Accompanies a flash sale section to draw immediate attention.

• Layout Options: Standard

• File Requirements:

  • Desktop: 1190 x 450 pixels

  • Mobile: 450 x 150 pixels

  • Formats: JPG, JPEG, PNG

• Recommendations:

  • Highlight short-term offers with phrases like "Today Only!" or "Hurry, Limited Stock!"

  • Pair the banner with a countdown timer to create urgency.

6. Top Brands

• Purpose: Showcases notable brands available on the store.

• Layout Options: Standard, Classic, Trendy

• File Requirements:

  • Dimensions: 1080 x 1080 pixels

  • Formats: JPG, JPEG, PNG

• Recommendations:

  • Use high-quality brand logos for a professional appearance.

  • Ideal for collaborating merchants to highlight premium partnerships.

7. Shop by Category

• Purpose: Displays category images for intuitive navigation.

• Layout Options: Standard, Classic, Trendy

• File Requirements:

  • Dimensions: 1080 x 1080 pixels

  • Formats: JPG, JPEG, PNG

• Recommendations:

  • Include visually distinct icons or images for each category.

  • Feature categories like "New Arrivals," "Best Sellers," or "Gift Ideas."

8. Services Section

• Purpose: Highlights the services provided by the store, such as free shipping or 24/7 support.

• Layout Options: Standard

• File Requirements:

  • Dimensions: 100 x 100 pixels per service

  • Formats: JPG, JPEG, PNG

• Recommendations:

  • Use icons with matching aesthetics to maintain consistency.

  • Keep descriptions concise to enhance readability.

9. Sale Carousel Banner

• Purpose: Large, impactful banners for attention-grabbing carousel displays.

• Layout Options: Classic

• File Requirements:

  • Desktop: 1440 x 570 pixels

  • Mobile: 450 x 180 pixels

  • Formats: JPG, JPEG, PNG

• Recommendations:

  • Feature seasonal campaigns or exclusive collections prominently.

  • Include dynamic elements like gradients or animations to stand out.

General Design Tips

1. Consistency: Maintain uniform branding, fonts, and colors across all banners.

2. Localization: Ensure banners are prepared for both Arabic and English audiences.

3. Mobile Optimization: Design for mobile-first viewing, ensuring text and visuals are easily legible.

4. Call-to-Actions: Use compelling, action-oriented text to drive engagement (e.g., "Shop Now" or "Learn More").

5. High-Quality Imagery: Avoid pixilation by adhering to specified dimensions.

Inspiration for Use Cases

• Carousel Banners: Launch a series for holiday campaigns like "Festive Favorites" or spotlight a new product line.

• Sale Banners: Feature exclusive discounts during major shopping events like Ramadan or New Year.

• Category Banners: Curate collections such as "Eco-Friendly Picks" or "Luxury Essentials" to guide shoppers.

• Flash Sale Banners: Amplify excitement with banners for "Daily Deals" or weekend specials.