search

UdacityFrontEndScholarship / task-master

This application is a collaborative project made by the Google Udacity Front End Web Developer Scholars.
37 stars 95 forks source link

Proposing a Material Design Revamp for the Home Page layout (Retina ready) #118

Closed Manda7rsnt closed 6 years ago

Manda7rsnt commented 6 years ago

Proposal for a revamped Material Design Responsive Home Page

I propose the following changes to the current build as I feel I can contribute in the design and overall aesthetics of TASKMASTER.

  1. One Pager Website : Although the current homepage is a one pager, but to make it more interactive I would like to convert it to a more clean material theme while maintaining the current colour scheme (Black, White and Turquoise).

  2. Introduction Section | Why Taskmaster and Contact Section : These section come into same viewport while it would be more easy for the user's readability if these three sections come into three viewports respectively (that is one screen-one section-one scroll at a time).

same viewport

  1. The Contact Section : I am working on making the current form materialized and also working towards fixing the latest industry standard icons (my functional design snap attached with gradient of Turquoise Colour).

proposed contact form

OR A MORE INTERACTIVE CONTACT FORM VERSION (for the intricacies / corner-case or other expectations from the project )

contact-2

  1. The Footer : Aligning the Footer in accordance with the material theme. Giving an enhanced layout to the sitemap column. Aligning the social media icons in Links Column.

  2. Alignment of Sections in the Navigation Bar: Currently the section stretch to the end of the screen and not with the website's content.

screen shot 2018-04-20 at 4 41 22 pm

  1. Banner Images : The banner images are pixelated do not fit the screen (at-least not my system). Will work on fixing this or using better quality copyright images that ensure full width compatibility.

banner images

  1. Logo for Task Master : I also have a Logo in drafts. I'll be vectorising it pretty soon, once the above task is done. 

                               ### - (from a UI Design enthusiast's perspective)
Manda7rsnt commented 6 years ago

@user501254 @shashank-sharma @omtripathi786 @vattytrivedi @DeepPurohit Can I request for the link to this project's Slack channel ?

shashank-sharma commented 6 years ago

@Manda7rsnt The issues which you mentioned have some enhancement as well as fixing bugs. If you are planning to work on this, then I suggest you to go 1 at a time and make PR regarding to that issue. Materialistic theme is our main approach. I agree with these points:

  1. Introduction section enhancement
  2. Contact section with more interaction (second one)
  3. Footer enhancement
  4. Image selection

For our project slack channel visit: #cp_tsk_mstr There you can discuss what you are planning to do.

Manda7rsnt commented 6 years ago

@shashank-sharma yes I'll start working on these right away.

Focus being :

and Yes, I'll be taking it one step at a time and make PRs accordingly. Thank You

ribasu97 commented 6 years ago

@Manda7rsnt
Also, to add to shashank's point, i would like to say that instead of bringing in new designs, you can upgrade our current designs to Latest Industrial standards.

For example, i have seen that your new contact form is a complete new design. If you think that you can make our current design better , go ahead, i would discourage complete revamps of specific portions .

With that being said, i could not agree more on these points.

I love the section enhancement idea. And we are waiting for a stunning logo for our project for quite some while. We are also waiting for a wallpaper. Checkout this post.

https://frontendindiascholars.slack.com/archives/CA4R9NEH3/p1523873874000332

ribasu97 commented 6 years ago

And also, Teal would be the color . Not Turquoise.

Also. check out our primary color palette in our readme