The last icon is filled with blue compared to the first two icons. I also believe that the text in the centre should be a darker contrast as it is difficult to read.
First, the learn more button is not framed in a box as it should. The consequence can be 1. Inability to click on the learn more text easily. 2. Lack of visual consistency among other websites which can lead to confusion.
thank you, Arash for this useful content. about the question, i think: 1- the icons in the cards should be similar and consistent. actually, i don't know the technical term unfortunately but the third one looks odd. 2- I think the text color is difficult to read a little. 3- if the Learn more is a call to action, i think it should be more distinguished. a button for example. i think these three are key points to improve. Some things may change according to taste. For example, the background color bothers my eyes a little. the contrast actually. Not the color of the cards, I mean the background. Or, for example, I would have preferred the main title to be in the center. Finally, thank you for these wonderful contents.
- "Our Services" could be closer to the cards - the last icon is not consistent with the others - rounding the cards a little to give them a more friendly look - description text in the cards should be black or veery dark gray - page background white - drop shadow / blur around the cards. With the blue used elsewhere - Learn more should be right aligned. More logical to me.
- Our Services must have lesser margin to the cards - appdev icon is not consistent compare to the other two icons - I'm a fan of round edges card so i think it would help for better ui - body text must be darker (contrast) - learn more here is a CTA, it should be converted into a button, this will help it to gain more attention for possible conversions
1. Our service needs to be close to the card 2. The last icon is different from other icons 3. Rounding the card a lil bit to make it look friendly 4. Learn more supposed to be CTA 5. Descriptions needs to be a lil bit darker hence it will be more readable
1. We can change the last icon of "application development" to stroke only like other icons. 2. We can change the background color from off-white to dark brown or grey. 3. Gapping between Our service and three tabs. 4. We also have to change the text color from off-white to match with the background color for better readability. Please reply if I am going right.
the learn more button should be with a background and the body text in the cards should be of some darker color. The third icon is filled with color while the first two are not. Here is the lack of consistency I guess.
Here is what I think about the example interface at the end: 1. Contrast is not used correctly - the body text is really hard to see in the white background. 2. Personally - I think the "learn more" should be in a button style. Not only it will help stand out, but it will also be easier for touch-screen users to click. 3. Personally - the color scheme is bland, but it'll do lol. 4. iconography seems inconsistent. The icon for "Application Development" doesn't match with the other two. It's mostly readable and the whitespace are used effectively though.
This is my opinion 1/ The third icon is bolder than another All icons lack a label 2/ "Learn more" button does not stand out => fill with dark blue background blue, white text 3/ Should border-radius 3 panels 4/ The contrast of the text below the heading is too low. => should change the text color to dark grey 5/ The size heading should larger a bit 6/ The space among icons, heading, and content is good, but from content to the "Learn more" button is longer, I think it should consistency 7/ The "Our Services" title should place center Please help me review it and give me feedback Thank you so much
Hi. 1- Icons don't need a label in this case, but you are right that they are not consistent. 2- This is a matter of preference. Since the card itself is clickable, we can use a text button there. 3- Again, a matter of preference. It depends on the styling of other elements. 4- Correct. 5- It can be, but it's readable. 6- That's not correct because we should place elements based on the law of proximity, so the margin between the button and the description should be greater. 7- It can be, but there is nothing wrong with the left-aligned headings.
Botg two needs good contrast of icon.and text will be darker must will be there and final icon is good to represent nut text will be change into dark colour for good visible
1- CTA isn't clear. must have some background color 2- Headings within the boxes should be larger and bolder 3- Icons colors mismatched 4- description within the boxes is light
سلام استاد عزیز وقتتون بخیر. ممنون بابت کمک ها و زحمات ارزشمندتون. متاسفانه نتونستم کتابتون رو از لینکی که قرار دادید در کپشن دانلود کنم. ایمیل confirmation از طریق سایت ارسال نشد.
Icons: 1. Problem: these icons seems clickable. solution: using netural color instead of using blue to the icons and their background. 2. Problem: the last icon style is not matching the others. solution: making the last icon to outline style. Text: 1. Problem: the body text colour has low contrast. Solution: increase the contrast by applying a darker colour or just simply using the same colour as the title. Button: 1. Problem: 'Learn more' buttons is not friendly to the colour blindness to identify if it is clickable or just the read only text. Solution: use outline button instead of text only button.
All three icons does not match with what the text is saying. All of the summaries under the heading are too light they need to be spruced up some more. I also feel like the learn more in the second box is too small but it could just be my eye playing tricks on me
1) Insufficient Contrast: Not bright enough read and attractive 2) Inconsistency in Design: Third icon is filled one and the first two are line icons 3) Poor Color Scheme Selection: Unable to read the text.
1. The contrast is too low 2. Lack of consistency in spacing or texts 3. Poor visual hierarchy 4. call to action button is not present there so that users can understand the next line of action
The last icon is filled with blue compared to the first two icons. I also believe that the text in the centre should be a darker contrast as it is difficult to read.
You are totally right.
And also alignments @@DesignWithArash
First, the learn more button is not framed in a box as it should. The consequence can be 1. Inability to click on the learn more text easily. 2. Lack of visual consistency among other websites which can lead to confusion.
thank you, Arash for this useful content.
about the question, i think:
1- the icons in the cards should be similar and consistent. actually, i don't know the technical term unfortunately but the third one looks odd.
2- I think the text color is difficult to read a little.
3- if the Learn more is a call to action, i think it should be more distinguished. a button for example.
i think these three are key points to improve. Some things may change according to taste. For example, the background color bothers my eyes a little. the contrast actually. Not the color of the cards, I mean the background. Or, for example, I would have preferred the main title to be in the center.
Finally, thank you for these wonderful contents.
Great video! Need more of these common mistakes and how to fix em'.
Thank you so much. More to come.
- "Our Services" could be closer to the cards
- the last icon is not consistent with the others
- rounding the cards a little to give them a more friendly look
- description text in the cards should be black or veery dark gray
- page background white
- drop shadow / blur around the cards. With the blue used elsewhere
- Learn more should be right aligned. More logical to me.
you have 7 points. and all are for beginners
your teaching skills are amazing!!! Thanks for being there to help:)
That’s very kind of you. Thanks.
amazing teacher, easy to understand even for me as a beginner english student, you are really good man thank you so mouch for these videos.
Thank you very much. That's so nice of you.
- Our Services must have lesser margin to the cards
- appdev icon is not consistent compare to the other two icons
- I'm a fan of round edges card so i think it would help for better ui
- body text must be darker (contrast)
- learn more here is a CTA, it should be converted into a button, this will help it to gain more attention for possible conversions
1. Our service needs to be close to the card
2. The last icon is different from other icons
3. Rounding the card a lil bit to make it look friendly
4. Learn more supposed to be CTA
5. Descriptions needs to be a lil bit darker hence it will be more readable
succinct and comprehensive 🔥🔥
- I think it's the lack of sufficient contrast
- the use of whitespace
Impressive mate, you are doing a great job. Keep it up!
Thank you so much.
1. We can change the last icon of "application development" to stroke only like other icons.
2. We can change the background color from off-white to dark brown or grey.
3. Gapping between Our service and three tabs.
4. We also have to change the text color from off-white to match with the background color for better readability.
Please reply if I am going right.
Number 1 & 4 are correct but number 2 & 3 are a preference.
the learn more button should be with a background and the body text in the cards should be of some darker color. The third icon is filled with color while the first two are not. Here is the lack of consistency I guess.
More contrast in subhead and needs consistency in icon style.
You are totally right.
Your videos are so helpful! Thank you Arash!
Glad you like them!
The text with gray is not visible enough. Black color can be maintained.
I think the third icon doesnt need that outlines just "" looks good to me, and text on middle must be darker but not dark as the title.
You are 100% right.
Amazing Lecture Thank You Arash Sir!
Great teaching skills.
I found your channel yesterday and now Im stuck here.
Thanks for sharing
No problem. Glad it helped. Welcome aboard.
I like your video presentation. It is informative too, at the same time. Thanks a lot for your guidance!
Here is what I think about the example interface at the end:
1. Contrast is not used correctly - the body text is really hard to see in the white background.
2. Personally - I think the "learn more" should be in a button style. Not only it will help stand out, but it will also be easier for touch-screen users to click.
3. Personally - the color scheme is bland, but it'll do lol.
4. iconography seems inconsistent. The icon for "Application Development" doesn't match with the other two.
It's mostly readable and the whitespace are used effectively though.
This is my opinion
1/ The third icon is bolder than another
All icons lack a label
2/ "Learn more" button does not stand out => fill with dark blue background blue, white text
3/ Should border-radius 3 panels
4/ The contrast of the text below the heading is too low. => should change the text color to dark grey
5/ The size heading should larger a bit
6/ The space among icons, heading, and content is good, but from content to the "Learn more" button is longer, I think it should consistency
7/ The "Our Services" title should place center
Please help me review it and give me feedback
Thank you so much
Hi.
1- Icons don't need a label in this case, but you are right that they are not consistent.
2- This is a matter of preference. Since the card itself is clickable, we can use a text button there.
3- Again, a matter of preference. It depends on the styling of other elements.
4- Correct.
5- It can be, but it's readable.
6- That's not correct because we should place elements based on the law of proximity, so the margin between the button and the description should be greater.
7- It can be, but there is nothing wrong with the left-aligned headings.
@@DesignWithArash ❤ Thank you so much
You’re a great teacher🥰👏
Thank you so much. That's very kind of you.
Botg two needs good contrast of icon.and text will be darker must will be there and final icon is good to represent nut text will be change into dark colour for good visible
You are doing a great job. Thank you🔥
So nice of you. Thank you.
Please brother Can you do a video on road map or userflow.... How to be fast when designing, Color pallette
Hi Tony,
Sure.
1. The sub fonts can be more visible
2. learn more option can be in a button
Its padding i would say its not equal and the center paragraph should be a little bolder or should use dark color to make it easier for users to read
The text paragraph is greyed white. Lack of contrast most especially for what users need to read.
Hi, can you give any clue about the resposive design at 7:20? I mean, how to make content stretch up-inside when resizng the parent frame width?
icons arent of same style the is 1 filed and 1st 2 are void and the text color contrast isn't perfect ,,,it should be a darker shade of gray
You are absolutely right.
Contrast with the typography sizes
1- CTA isn't clear. must have some background color
2- Headings within the boxes should be larger and bolder
3- Icons colors mismatched
4- description within the boxes is light
سلام استاد عزیز وقتتون بخیر. ممنون بابت کمک ها و زحمات ارزشمندتون. متاسفانه نتونستم کتابتون رو از لینکی که قرار دادید در کپشن دانلود کنم. ایمیل confirmation از طریق سایت ارسال نشد.
Bro i love your tutorial on ui ux the only probem is the sitmap can you please make a video of it
Great teaching and i like it so much!!🤝💥keep teaching and i learn many lot things in this video thnk u so much🥹🫴🏻
I think the icon styles need to be consistent. Also the sub text colour should be a little more darker
That's right.
Icons:
1. Problem: these icons seems clickable. solution: using netural color instead of using blue to the icons and their background.
2. Problem: the last icon style is not matching the others. solution: making the last icon to outline style.
Text:
1. Problem: the body text colour has low contrast. Solution: increase the contrast by applying a darker colour or just simply using the same colour as the title.
Button:
1. Problem: 'Learn more' buttons is not friendly to the colour blindness to identify if it is clickable or just the read only text. Solution: use outline button instead of text only button.
the white on white makes the elements disappear? It could use more color?
All three icons does not match with what the text is saying. All of the summaries under the heading are too light they need to be spruced up some more. I also feel like the learn more in the second box is too small but it could just be my eye playing tricks on me
Correct.
Inconsistent icons. Last icon should be outlined. And the body text should have a bit of contrast
Text colour,colour contrast,icon background
The space between the fourth element and the last element seems too much and I can barely see the fourth element
1) Insufficient Contrast: Not bright enough read and attractive
2) Inconsistency in Design: Third icon is filled one and the first two are line icons
3) Poor Color Scheme Selection: Unable to read the text.
Hey Arash ,i need a beginner wireframe tutorial from you please
Hey. I'll add it to my list.
Keep going! You'll soon get thousands of likes per video!!!
Thank you so much for the encouragement and support. I appreciate it.
Last icon isn't consistent, our services can be bit closer to cards, body text in 2nd card is having poor rig and rags,
The text color in the center is too light..should be darker to improve readability.. and the last frame , the icon is filled
tnx for your explanation💎
You are welcome!
First 02 icons are not filled and the last one is filled that does not look nice
Exactly.
HI, I was wondering, are there platforms where to find beta testers for your UI design?
Hi, yes there are. You can check out Conjointly.
1. The contrast is too low
2. Lack of consistency in spacing or texts
3. Poor visual hierarchy
4. call to action button is not present there so that users can understand the next line of action
dude you're amazing
light color of text is this the mistake or not
please reply tome
very helpfull
Glad it helped. Thank you.
Heading text should be larger
Icons color mismatch
Central text should be black
Buttons color should be blue with white text
Can u pls let me know about the ways to get user feedback? I didn't hear you well😅
Thank you
No problem.
Me : i'm in love with my firt design 😍😍😍
Arash: please don't fall in love with your design 😑
Me: oups 😋😋 I already did😂
Hahaha.
What is done is done. 😊
The text body is not visible and not readable
very helpful video
Glad it was helpful!
• Low color contrast
• Lack of consistency
Amazing
Thank you.
Inconsistent logo size and contrast
The contrast is poor and the icons are'nt consistent
contrast and typography.
lack of consistency
Menu animation is absent, Poor color scheme and poor visual hierarchy