Skip to main content
S
Shabeer5EB8
Participant
January 4, 2023
Answered

Color and design consistency.

  • January 4, 2023
  • 2 replies
  • 607 views

Hi there,

 

Hope you all doing well.

 

I have a question about the color consistency. I have seen some e-commerce platform using for different categories different interface and CTA color.

 

So the thing is I have a UI design project for same e-commerce application and diveded to 4 categories ( market,food, grocery, lifestyle) so what's your opinion about choose different design interface and CTA color. 

 

For example for food orange theme

Grocery green theme

Market black theme

 

 

Is it good decision?

 

Please share your thoughts

 

Many thanks 🙏

    This topic has been closed for replies.
    Correct answer AkinGn

    Hi @Shabeer5EB8, hmm I couldn't be sure until I see the design and since I don't recall any real world examples, now that you provided both, and as I see it you themed the colors in a harmonious way so I wouldn't say they'll create inconsistency, I might only consider making blue a little more saturated since it looked a little pale in comparison to other colors' hue values. (This is one of my fav color videos actually, in this video he creates a great palette editing hues (along with lightness and saturation, but it'll give you some ideas for some other projects) : https://youtu.be/u5AnzLg1HxY?t=180 , if you haven't watched already 🙂) So looks like this can work in a consistent way. Hope this helps!

    2 replies

    A
    Abdullah31561620os5y
    Participant
    October 6, 2023

    Hello! It's great to hear that you're working on a UI design project for an e-commerce application. Using different colors for each category in your e-commerce UI can be a good idea if it aligns with the brand, improves user experience, and maintains accessibility. Ensure that the colors make sense for each category, are visually appealing, and help users navigate. Test with users for feedback. Keep it visually cohesive and logical. Good luck! 😊

      AkinGn
      Community Expert
      AkinGnCommunity Expert
      Community Expert
      January 5, 2023

      Hi @Shabeer5EB8, hmm honestly using different interface and different CTA color in the same app doesn't sound consistent. It is suggested to use same treatment/style for the interaction elements to be consistent and increase the usability. I liked the idea of color coding categories but thinking how I'd do that, maybe some different hues of the same light/pastel etc (or dark, depending on your design) background color would be the best choice for that, creating a slight difference in the background color. For example a very light orange bg color for the food theme, very light green bg for grocery theme etc. If you like to share your design here or at XD discord (if you're not already there: https://discord.com/invite/adobexd under #share-your-work channel ( https://discord.com/channels/557579652294639616/1000501693252898897 ), tagging me using my handle @AkinGn I'd like to give more feedback and maybe some othe mentors there as well) Hope this helps!

        S
        Shabeer5EB8Author
        Participant
        January 6, 2023

        Thank you Mr @AkinGn 

        I appreacite your suggestion. I will share the design theme here for your better underatnding further comments.

         

        as you can here I used pink theme for food. and the idea is it will change accourding to the category colour.

        and behind this idea I have seen 2 leading E copmmerce platform using this method in thire mobile version platform

        • noon.com
        • flipkart.com

         

        AkinGn
        Community Expert
        AkinGnCommunity ExpertCorrect answer
        Community Expert
        January 6, 2023

        Hi @Shabeer5EB8, hmm I couldn't be sure until I see the design and since I don't recall any real world examples, now that you provided both, and as I see it you themed the colors in a harmonious way so I wouldn't say they'll create inconsistency, I might only consider making blue a little more saturated since it looked a little pale in comparison to other colors' hue values. (This is one of my fav color videos actually, in this video he creates a great palette editing hues (along with lightness and saturation, but it'll give you some ideas for some other projects) : https://youtu.be/u5AnzLg1HxY?t=180 , if you haven't watched already 🙂) So looks like this can work in a consistent way. Hope this helps!

          Terms & ConditionsAccessibility statement
          Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices