0

Here is my first webpage created (for a chatbot). I know that the UI sucks, I need you experts suggestions to make it look better.

https://s3.amazonaws.com/rakeshlexbucket/Lex_Test.html

To replicate my issue.

enter the below.

you : Search for Ram.
bot  : How many Incidents do you want to see. To see all, please type ALL
you : All
bot : Here are the tickets containing "Ram" keyword INC0010324, INC0010336, INC0010279, INC0010278, INC0010261, INC0010276, INC0010275, INC0010244, INC0010280, INC0010334, INC0010316, INC0010227

Issue1:

when the text is above the background Image(Robot face), it is pretty much unreadable. the links that appear are in blue color. what would be a better color for them. what would you suggest to be the ideal colors and fonts as the guys here are stuck to that Background image. they don't want to move out of it.

Issue 2:

click on any links that come up, it will slide the div to a side and fill that with some other content, what should be the ideal color, fonts and BG color for this new div.

Also I'm looking for feedback on how can I improve the UI/UX.

I posted this on https://ux.stackexchange.com but one of the guys suggested posting it here would be more relevant.

Thanks

  • 1
    Please give our guideline for critique questions a read and check wether you can edit your question to follow them. Thanks! – Vincent Oct 6 '17 at 11:33
  • 1
    I'm afraid your site is too "unstyled" and empty (using the default font, no clear color scheme, image not covering the background, not much content) to give you good advice. You're basically asking us how we would design your site. Your question has to be more like: "I want to achieve this, I've tried this and this, but it doesn't work - what do I do?". Anyway, my advice: Get rid of the image. In my experience it never works with text on top of that kind of image with both dark and light colors. Also you need to make sure that you can legally use it, it's most likely copyrighted. – Wolff Oct 6 '17 at 16:06
  • This seems like an interesting question to ask over at usability.testing.exchange — it's a place intended for feedback about design and usability, and it'd be interesting to see what kind of answers / ideas people reply with, if you post this question. Please note that it's a feedback exchange place — you'll get back as much feedback as you give to others about their stuff. (I'm developing it.) – KajMagnus Dec 19 '17 at 3:03
1

There is one thing you can do that would help a lot.

Make the background of the chat window opaque instead of transparent.

That would make the text a lot easier to read.

Or just make it a solid color. It does not really need to be see through does it?

Also, maybe you could put some kind of border around the text at the top. Or perhaps it could be living inside of some kind of navigation bar like how you see in stack exchange.

Those changes would make it look a lot better if you are just going for some basic advice.

Not the answer you're looking for? Browse other questions tagged or ask your own question.