Home page for the Flutter app.

[vikasp52]

Hi All,

I have created the Home page. Currently it holds the dummy data.

Please have a look and share your thoughts and suggestions. Refer the screenshot.

It has a Upcoming event and Previous events. You can also download the app from below link.

Link: https://drive.google.com/open?id=1tFGLinZoHExrygzZkgh2pQLOOIsrQn7P

[nikhil-thakkar]

Can you raise a PR?

[karntrehan]

This looks pretty dope @vikasp52, Just to add that this is part of the Flutter app.

Would request someone from the design team like @faizmalkani or @swapnilborkar to share feedback on the design and suggest improvement on the cards.

Raising a PR at this stage is something I would not recommend.

[swapnilborkar]

Good work guys. Proud of the commitment you are showing. Having said that, I have a ton of feedback. This is going to be harsh but I would like you to take it constructively. Since this project is about learning, I wouldn't want to go soft on the feedback and this will help you for projects you pick up live when you're a part of the larger organisation at a senior role.

Here's my initial feedback:

1. Calling homepage Home is irrelevant. We aren't a large company with 20-40 products to have a Home.

2. Navigation drawer should be used for more than 5 elements. I do not see the need for the same + it's a pattern that's seeing withdrawal so no reason to stick with it.

3. Too complex for an MVP. There's no need to have so many elements like Search, Filter and NAV Drawer for now. Start minimal and don't overload with features. Only add features if absolutely necessary and needed backed by data.

4. Looks 2014. Try different shapes from new Material Design guidelines. Refrain from using primary color so boldly.

5. Use better typefaces. I recommend trying Montserrat from Google Fonts. Try Fontpair.co for combinations.

6. What happens when there are no events? What happens when there's just one event? What happens when there are several events? Create empty states. Use undraw.co if needed

Overall, think this is way too complex on both a visual and functional level. Recommend starting off on a fresh page and working on just the bare minimum and absolutely necessary stuff.

Make a list of stuff absolutely needed and run it by me. I'll make a wireframe you can go with.

Don't take this feedback too seriously. Implement what you can. These are my thoughts towards the design. If you feel otherwise, you could ignore it :)

[swapnilborkar]

I've worked on an initial design from what I believe should be the correct way to start. This is minimal, focuses on correct practices, encourages using open source libraries, giving credits to OSS and of course, mentions our contributors: https://zpl.io/am97eqQ

Ask for access from @nikhil-thakkar since he's leading this.

Instructions:

1. Clicking on the card opens Meetup event page (for now)

2. Clicking on Navigate, opens Google maps with a navigate URL with the source left as blank and destination set to meetup venue. On the user clicking on it, GMaps should open and automatically detect user's location and show them the path to venue.

3. Upcoming events are followed by past events to eliminate the unnecessary white space. Use a filter over the past events. Up to you to do B&W or fade out or simply reduce opacity.

4. Card radius is 6DP. This is going to be followed throughout the app for any Cards/ CTAs hence forth. All clickable links and icons will follow the blue (#2A89E5) or Material Black (#212121). Your call. Exception being Bottom Navigation which will use the accent colour for active state. Open to suggestions on which color the accent should be

Implement this one screen and loop me in on feedback and follow it up with more screens, if needed or let me know if you want them designed. If I have the time, will take it up.