gita / BhagavadGita

A non-profit initiative to help spread the transcendental wisdom from the Bhagavad Gita to people around the world.
https://bhagavadgita.io
GNU General Public License v3.0
164 stars 25 forks source link

Better UI design scheme for Verse card #248

Open redraushan opened 5 years ago

redraushan commented 5 years ago

What

How

I have created a POC that that demonstrates the above mentioned changes, also I am adding the current version of the Verse card. Please compare both and and let me know any changes you would like to make to make it more better.

Current Verse Card

old-verse

POC Verse Card

screenshot-bhagavadgita io-2019 02 24-09-00-40

redraushan commented 5 years ago

Question

font

samanyougarg commented 5 years ago

Hi @redraushan,

  • Elements of the Verse card should be more aligned.

Agree with you on this.

  • Social sites like - FB, Twitter, and share should be shown at the bottom of the card, giving more clarity to the Mantra heading.

Yes, you are right. The share buttons do obstruct the reading.

  • Unified design for the Buttons.

Not too sure about this. I am following the material design guidelines as implemented in MDBootstrap. Happy to discuss more about this.

  • Better contrast ratio between the background color and font-color of the verse.

Yes, you are right, but I think black is the most readable color when it comes to text. Dark brown makes it a bit harder to read. Again, happy to discuss more about this.


I really like the overall design you suggested. It helps pop up the verse text and meanings more and makes it more readable. If we make some changes according to the points above, it will turn out to be very good.

Thanks a lot for doing this...

samanyougarg commented 5 years ago

Question

  • Can we have a replacement of samarkan font? To me it's a bit more decorative and less readable to the eyes unless you put a bit effort to read.

font

Yes, that's right. I basically wanted to distinguish the chapter name in Sanskrit from that in English. Samarkan was the only font that was similar to Sanskrit that I found. Do you know of any alternative fonts?

redraushan commented 5 years ago

Yes, that's right. I basically wanted to distinguish the chapter name in Sanskrit from that in English. Samarkan was the only font that was similar to Sanskrit that I found. Do you know of any alternative fonts?

I am yet to find one, but for the time being can we go with the rest part? Let me know when you are available, we can have a call to conclude the same.

Thanks

vishwasnavadak commented 5 years ago

Question

  • Can we have a replacement of samarkan font? To me it's a bit more decorative and less readable to the eyes unless you put a bit effort to read.

font

Yes, that's right. I basically wanted to distinguish the chapter name in Sanskrit from that in English. Samarkan was the only font that was similar to Sanskrit that I found. Do you know of any alternative fonts?

Since that font is just used for decoration, can we just get it changed for more readability?

PS: Great site!

redraushan commented 5 years ago

@vishwasnavadak Do you have any font recommendations that we can take as a replacement for with the current one?

I guess it should be less decorative and should keep the flavour of Sanskrita.

vishwasnavadak commented 5 years ago

@redraushan I can search for some. But as for as sanskrita is considered, I think Samarkan is the only font available. I will get back with some fonts.

samanyougarg commented 5 years ago

Hi @redraushan and @vishwasnavadak,

Sorry for the late reply.

I found another font called "Ananda Neptouch". Please have a look at it and let me know if you think this one is more readable.

Samarkan -

Screenshot 2019-06-15 at 16 20 53

Ananda Neptouch -

Screenshot 2019-06-15 at 16 17 27
redraushan commented 5 years ago

Hi @samanyougarg ,

What a great font you have come up with :+1: I would like to see it implemented. @vishwasnavadak what do you think?

vishwasnavadak commented 5 years ago

Hey, great that you got a replacement font. It is way more readable without the top line.

Go for it.

vishwasnavadak commented 5 years ago

Let me know if you need any help in putting things together

redraushan commented 5 years ago

Hi @vishwasnavadak,

I will come up with the PR acccumulating all the changes that I have proposed above in the thread along with new font :100:

Thanks @samanyougarg

samanyougarg commented 5 years ago

Awesome! @redraushan please let me know when you submit the PR.