Design Tasks Page

[ykarim]

Design the full Tasks page based off the chosen theme. Design must also be mobile-friendly.

Requirements for the Tasks page include: (note that you can change the order of this info and skip some parts)

• Navbar
  • Must contain logo used for site (could be combination of GCI and OpenMRS)
  • Must contain links to all 5 pages of site
• Current Tasks (maybe also as horizontal cards) in a searchable format with filters for categories and other features. This could be a scrollable list as we don't want it to occupy the whole page)
  • Each card will expand to contain necessary task info and link to task on GCI dashboard
• What are tasks
  • Types of tasks (categories)
  • Instructions to complete tasks
  • Tips with Tasks (useful links like guide to attributing creative commons works, OpenMRS pull request guide, or pexels for public images)
  • How to receive help with tasks
• Examples annotated Excellent task submissions vs. Bad Task Submissions
• Footer

Note that the exact text doesn't have to be present. You may use sample text like "lorem ipsum dolor sit amet". We just need to see where all the information will go on the page.

Submit the design as a PDF/png in a professional format under designs/final-designs directory (this directory may need to be created). The design must include the webpage as shown on a computer and on mobile.

[anuar2k]

I'd like to work on that :) @ykarim

[ykarim]

got it!

[ykarim]

Hey @anuar2k , this task is now ready for work. The following resources may assist you: https://github.com/satvikshri/OpenMRS-submissions/tree/master/homepageui and https://github.com/satvikshri/OpenMRS-submissions/tree/master/Task%20Page. Note that the .ai file contains the design and is an Adobe Illustrator file.

The given resource is a theme and you are required to redesign though some elements of the page may remain the same. You are free to fully redesign the page to your liking though you must keep the same theme (color palette and navbar)

Some notes about the current design include:

• It might be best to have an "all" option for the task category filter for those who might not know to unclick to remove the task category filter. (This is just a thought)
• The organziation for the task cards seems out of place. View Info is placed randomly when it's usually in the bottom right. For example, learn more buttons and such. The deadline being next to the name doesn't really appear that great. I'd suggest redesigning the task cards imo
• Maybe find a format to display more than 5 tasks per page of tasks. (Clicking buttons is going to be annoying for users.)
• The next and previous buttons don't stand out as buttons as they lack a border and shape inconsistent with other buttons on the site.
• Also the large title "Google Code-in 2018 with OpenMRS" seems irrelevant as students would already know what the site is for from many different places.
• Maybe link from the View Info button to the Google Code-in Task as the GCI site should serve some purpose and holding the info in both places is redundant. This would get rid of the task modal which makes sense because its the same thing as the GCI site's task modal.

Check the issue description for the rest of the info.

[ykarim]

FYI the footer can be skipped as this will be done in a separate task.

[anuar2k]

@ykarim thank you for the detailed description :)

[ykarim]

Yup feel free to make any other changes you think are necessary