#715 Requesting review for the renewed design of Fedora Easyfix
Opened 3 years ago by t0xic0der. Modified 2 years ago

You can take a look at the current state of the Easyfix site by visiting the link provided below.

https://fedoraproject.org/easyfix/

I am being assisted by @kmrinal19 to modernize its look and feel. I am attaching the screenshots of how it would look once we are done with the work. We are making Bootstrap 5.0 CSS framework to do all the heavy styling work for us but I think that we could use some tweaking to make the LnF "fedorable".

Please do let me know what you think about the screenshots. Suggestions and improvements are very welcome.


On the landing page, I think we might have used the Fedora logo a little too many times. Of course, this ticket would help us get a custom logo for the site which we may use here.

What do you think?

Screenshot_2021-01-11_Fedora_Project_Easyfix.png

This is the index.html file.

[index3.html](/design/issue/raw/files/f00595a91798caadbc8c66e6f9ecc1f8e30306a66e093bd56511bf35ae95e1eb-index3.html)

This is the search.js file.

[search.js](/design/issue/raw/files/6dfe8390940710cdcc1a8cd51121830807b722fa010a92a87eb791d2c3b91ab0-search.js)

Please keep the structure of the directories as specified below for the JS asset to load up properly.

- index.html
- js/
    - search.js

Thank you @kmrinal19 for the awesome additions in the in-page searching functionality.

The following archive bundles the index.html file with all the necessary dependencies for in-page searching, CSS assets and fonts. Just extract it and take a look at the index.html.

[fedora-gather-easyfix-preview.zip](/design/issue/raw/files/2603c501d902f1ff4ff1c918afd99fb1b3c24d7e3273aeec22aa97e347163023-fedora-gather-easyfix-preview.zip)

Thanks.

Any updates to this ticket would be really helpful.

Please feel free to ask if there are questions/doubts regarding the thought process behind the existing design. :sweat_smile:

Hi @t0xic0der ! This looks pretty good and easy to navigate.
I am a bit concerned by the font you chose to use for the Welcome message and ticket numbers. It doesn't seem to be on brand. Montserrat seems like a safe choice there.

Thanks for the review @mleonova.

Montserrat definitely can replace the Welcome message but I am afraid that the issue numbers would require a condensed font due to the fact that they are quite long.

The ones that I use are Barlow Condensed (for welcome message, headers and issue numbers) and IBM Plex Sans (for generally everything else).

Could you suggest me a replacement for the condensed font please?

Thanks.

@t0xic0der Montserrat does not have a condensed typeface, but those numbers are really large and from a UX pov unnecessarily so. I would recommend scaling them down. Fedora web standards are Montserrat for headers and Open Sans for body type.

We're happy to do a more extended review of the design here with UX suggestions, I'm going to tag this triaged and hopefully get back to it soon (@mleonova if you have cycles I'm happy to assign to you too, I'm going to assign to myself just for now as we've new Outreachy recruits looking for tasks and I think this one is best handled by someone like yourself who has a longer history with the Fedora branding standards.)

Metadata Update from @duffy:
- Issue assigned to duffy

3 years ago

Metadata Update from @duffy:
- Issue tagged with: triaged

3 years ago

@t0xic0der Do you have a repo for the proposed new design so I can review it? I'd rather do a git clone than download individual files off the ticket, if you know what I mean?

@t0xic0der Montserrat does not have a condensed typeface, but those numbers are really large and from a UX pov unnecessarily so. I would recommend scaling them down. Fedora web standards are Montserrat for headers and Open Sans for body type.

Okay. Here are the things that I'd do next,

  1. Scale down the font size of the issue numbers. (Albeit I'm feeling a bit ambiguous in doing so as issues are to be recognized by their numbers and that's the reason why the font size has been kept big with that intention - so help me here with what you think please)
  2. Replace the current body font, which is "IBM Plex Sans" with "Open Sans".

@t0xic0der Do you have a repo for the proposed new design so I can review it? I'd rather do a git clone than download individual files off the ticket, if you know what I mean?

Sure, I understand. Here you go.
https://pagure.io/fork/t0xic0der/fedora-gather-easyfix/tree/experience-modernization.

Thanks for attending to this ticket, @duffy.

Hi! so I had a few points from my side on the review of this ticket,
I went through the whole issue and the attached links, monsterrat seems good for this, we can also work on the whitespace and make the page more clear, i find it a bit crowded right now,
the fedora infrastructure apps icon seems to be smaller, it could have had better spacing and maybe a bit bigger,
I love the first screenshot of the issue, but it was changed i guess?
I would love to know more from you @duffy
i have a few more points in mind, would love to discuss with you! Also apart from this can i work on it too?

Screenshot_2021-03-02_at_8.34.48_PM.png

Hi! so I had a few points from my side on the review of this ticket,
I went through the whole issue and the attached links, monsterrat seems good for this, we can also work on the whitespace and make the page more clear, i find it a bit crowded right now,

The layout has been purposely set to boxed-type container to keep the attention at the center part of the page.

I love the first screenshot of the issue, but it was changed i guess?

That is the screenshot which is the object for the discussion here @swast1. The modernization of the layout is taking place in my fork and @duffy and @mleonova are guiding me with their reviews. I do remember posting the link to my fork here so please feel free to take a look at it.

Metadata Update from @duffy:
- Assignee reset

3 years ago

Metadata Update from @duffy:
- Issue assigned to swast1

3 years ago

Swastika and I met today and did a heuristic eval of the mockups @t0xic0der provided. Swastika is working on cleaning up the report and putting together some new mockups to implement our suggestions / address the issues we highlighted:

https://hackmd.io/hcOdFczXSBWVibNcTy0CyQ

Thank you for the attention to this review ticket and for the evaluation that you performed on the implementations that I have done so far. I have gone through the discussion shared here and have come to appreciate the attention to detail, look 'n' feel and usability and I would ask for inclusion in further such discussions for there's a lot I can provide and a lot I can learn from them too.

The commits I have made recently to the fork, address the suggestions made here https://pagure.io/design/issue/715#comment-717513 to a certain extent. Feel free to take a look at the attached screenshot to check on the progress made so far.

Screenshot_2021-03-02_Fedora_Project_Easyfix.png

@t0xic0der Hey just for full transparency, @swast1 and I met and did the review taking the persona of a new contributor, and I don't think that would have worked with a site developer like yourself being present - because when a new user is trying to make use of a website, they don't have the benefit of the developer sitting there with them to explain their confusions. The assessment's main purpose is to identify potential issues / confusions so it's important to do that as close to the end user's perspective as possible.

I think however as @swast1 comes up with mockups / proposals for solving some of those identified issues, that you collaboration is going to be critical since you know what data you have available and how the site is set up and what the various limitations / possibilities are on the implementation side!

@t0xic0der Hi, I'm sorry i got confused by the already existing site, my bad! Got it @t0xic0der !

@t0xic0der Hey just for full transparency, @swast1 and I met and did the review taking the persona of a new contributor, and I don't think that would have worked with a site developer like yourself being present - because when a new user is trying to make use of a website, they don't have the benefit of the developer sitting there with them to explain their confusions. The assessment's main purpose is to identify potential issues / confusions so it's important to do that as close to the end user's perspective as possible.

Total +1 to this! I might not be very successful in providing end-user empathetic suggestions here being a webapp developer.

I think however as @swast1 comes up with mockups / proposals for solving some of those identified issues, that you collaboration is going to be critical since you know what data you have available and how the site is set up and what the various limitations / possibilities are on the implementation side!

Exactly, @duffy.

As @swast1 goes on introducing the mockups and proposals here and with you greenlighting them, I would go on running feasibility checks and implementing them.

Sounds like a plan?

@t0xic0der Hi, I'm sorry i got confused by the already existing site, my bad! Got it @t0xic0der !

No problem. Please feel free to ask if you have any doubts or concerns about the Easyfix app and we would happy assist you. Thanks for the insightful discussion there :smile:

@t0xic0der Hey just for full transparency, @swast1 and I met and did the review taking the persona of a new contributor, and I don't think that would have worked with a site developer like yourself being present - because when a new user is trying to make use of a website, they don't have the benefit of the developer sitting there with them to explain their confusions. The assessment's main purpose is to identify potential issues / confusions so it's important to do that as close to the end user's perspective as possible.

Total +1 to this! I might not be very successful in providing end-user empathetic suggestions here being a webapp developer.

I think however as @swast1 comes up with mockups / proposals for solving some of those identified issues, that you collaboration is going to be critical since you know what data you have available and how the site is set up and what the various limitations / possibilities are on the implementation side!

Exactly, @duffy.

As @swast1 goes on introducing the mockups and proposals here and with you greenlighting them, I would go on running feasibility checks and implementing them.
Yes this sounds greaatt :))) so do we have a deadline to stick to?
Sounds like a plan?

@t0xic0der Hi, I'm sorry i got confused by the already existing site, my bad! Got it @t0xic0der !

No problem. Please feel free to ask if you have any doubts or concerns about the Easyfix app and we would happy assist you. Thanks for the insightful discussion there :smile:

@t0xic0der so do we have a deadline to stick to? I will upload the arranged documentation soon, i have started working on it already

@t0xic0der so do we have a deadline to stick to? I will upload the arranged documentation soon, i have started working on it already

I think @duffy would be able to help you with that.

Hi, so as I was working on the documentation of the evaluation first, I started off with writing it as notes, but then learnt a bit more about Heuristic evaluation and started once again by making a table, which would be more convenient to read and work on. So here's my progress till now, please give your feedback and suggestions as well, I wanted to know if I'm doing this correct
https://hackmd.io/@ARdpOEUhSGqqWcBvLl_25Q/Byv_CfAfO

Thank you!
Swast :))

Hi, so the work on the documentation of the evaluation is finally done, you may have the final look of it here
https://hackmd.io/@ARdpOEUhSGqqWcBvLl_25Q/Byv_CfAfO
The Original copy of the evaluation is here
https://hackmd.io/@Q6DxUZEYShOXKI6aaQmJNQ/HJCVi0sGd/edit

A few of them might not have severity level, that was because i couldn't understand what to rate them. Please let me know if i need to improve it or make any changes to it.
I would love if you could go through it once.
Also @duffy should I start with the wireframes? I will upload lo-fi wireframes by a day or so, so may be we could have a discussion on them too.

@duffy @t0xic0der

~Cheers, swast

Hi @duffy and @t0xic0der , i made a few lo-fi wireframes, and in the process i realised we need to change a bit from what we had decided because the new changes might make more sense.

  1. Like having tags under the tickets will be better as the new contributors would like to work on the tickets and issues not the project, if any project will have many tickets then it can get difficult for the contributor to look for their kind of project.

  2. Also we can add a dynamic search system on the pagure and bugzilla pages to look for tickets according to most active, skill sets, most recent made.

  3. Instead of adding the guidebook/FAQ at the navbar, we can add it to the right corner (preferably up because it is quite important here as contributors are unaware of most of the stuffs here).

  4. The cards on the front page will include graphics and illustrations too so it will make the page more attractive.

I would really reallyyyy appreciate a feedback or suggestion from you :)

More wireframes are on the way, i just wanted to have your views on them. Also @duffy when better wireframes will be ready can we have a proper evaluation again? as it will help me refine the experience more, the more the better :))))

Adobe_Scan_Mar_09_2021_1.jpg

I hope the images are clear enough or else I will post another one

I am not so aware about how heuristic evaluations work but the content inside the current revision is well-explained and gives a clear idea of the things that need to be worked on and ideas proposed. It is also a remarkable improvement from the previous revision as well. I am afraid I would not be able to suggest changes to it for it would require me to know about the process in the first place, which I don't. @duffy would be the best person to consult here :) Great work so far.

To https://pagure.io/design/issue/715#comment-720057, writing "Fedora Easyfix" kinda looks like an "eh" move here and we would want to keep them separately, much like the proposals made here https://pagure.io/design/issue/714#comment-717524. Also, filtering with respect to skill level is appreciated but a difficult target to attain as it would require more labels on the issues marked "easyfix" too. Please do include something in the tagline which goes in the line of the following points and summarize it as you see fit.

  • Easyfix encompasses easy-to-fix, self-contained and well-documented issues on repositories maintained by the community.
  • The issues listed here give a starting point to new contributors who wish to have a more practical experience in contributing.

To https://pagure.io/design/issue/715#comment-720058, the tag list is a brilliant addition but it would also lead to us needing to change the way the backend code works. Apart from that, the way the repositories are laid down looks good - albeit the element showing current assignee and the state of the issue is dearly missed. Appreciate the progress made so far!

(As a sidenote, please keep us from breaking our necks by sending landscape uploads from now on, would you? :stuck_out_tongue_winking_eye:)

What do you think @duffy?

Thank you so much for your feedback @t0xic0der , it is clear now what easyfix actually is i was struggling with the tagline. Also yeah I will add the current issue of the tickets too thank you for pointing that out too. for the asignee part i guess multiple people will be working on a ticket so i added only the list of members. I guess @duffy could tell us if this will be asigned or an open project to work with a team like i have no idea.
Should I go for a simpler search system and tags or this will work?

Really sorry for this inconvenience, you won't break your neck the next time i promise! :laughing:

I tried out an hi-fi wireframe for the front page, including all the points discussed in our heuristic evaluation. Thank you for bearing with me from my last post and a neck sprain ;p
I would love to have your views on this, the next page wireframe will be uploaded soon :D
@duffy @t0xic0der everyone's suggestions are welcome <3

Front_page.png

https://pagure.io/design/issue/raw/files/15c5fdfbdd57363f9a38bab39f6c216daf590f17ae32a4c85ea89f2e4143b0a2-Front_page.png reminds of Bodhi, ain't it @duffy?

Looks very elegant to start with it. Here are my suggestions for this design.

  1. We might want to have a blurred background of Fedora Blue on the section where "Welcome to Fedora Easyfix" is written. It does look good in its current state but who knows, this might make it look even better?
  2. The lower section is underutilized I think. We could definitely do with five or more columns though depending upon the viewport width, it should be kept variable. The gap widths between the cards are kinda hurting to the eye (for they are too big).
  3. Is there a need for having the login button beside the issue-type selector? We could of course add other stuff like issue filters, or lead them to the wiki page which explains how new repos can be added to Easyfix but the login button put there looks redundant.

Good work so far, @swast1 :)

Yes you got it right @t0xic0der , it is inspired by bodhi, we decided to keep the nav bar like bodhi to keep it consistent and as it had a good nav bar system, is this okay or should I explore more?

The idea of blurred Fedora blue background seems interesting, I will definitely try it out here, We could even try using the traditional Fedora works, I can imagine some of them, will post up some iterations here soon.

The gap widths do hurt right now, I tried to include more whitespace, I will look into this, sticking to the fedora themes and guidelines, may be something like the cards on the getfedora.org

Screenshot_2021-03-31_at_10.51.46_AM.png

Yes, sure we should check out other stuffs too, I decided to put it there to get a fast access to new contributors to the login port, Issue filters are something i really want to add but could not decide it's place yet, I will post up a few more iterations, along with the Fedora pagure page

Thank you so much for your reviews @t0xic0der :)))

@swast1

Like I have mentioned it in the Join SIG chat as well, we could continue discussing this and getting reviews on the work in the Fedora Websites and Apps Team chat while posting the progress here as well. In that state, you would be reaching out for reviews to a wider community of website and webapp maintainers than just me and Mairin.

Makes sense?

@swast1

Like I have mentioned it in the Join SIG chat as well, we could continue discussing this and getting reviews on the work in the Fedora Websites and Apps Team chat while posting the progress here as well. In that state, you would be reaching out for reviews to a wider community of website and webapp maintainers than just me and Mairin.

Makes sense?

Yes, this will surely improve the wireframes 100x times and we could even get a lowkey user reviews too, I will keep updating this on the group! I thought of even getting reviews on these on one of the meets but unfortunately I missed the previous one

I've been working on these wireframes for quite a long time but didn't get the chance to upload them and i kept refining them, so here it is:

Front_page.png

In the above wireframe i have updated it with the new feedbacks by @t0xic0der , I have added the phrase "Add a repo like a pro with Fedora wiki" so that people get encouraged, instead of adding a negative term like "getting stuck?" or "need help" which makes them feel dependent on us, if this makes any sense?

I have even made the other screen, fedora pagure projects, I have added some notes too, as it was getting difficult to explain it over here hehe

Frame_1.png

Please et me know if the images are not clear or something, I will update for reviews on the group as well!

love to here your views on these @duffy , @t0xic0der , @riecatnor <33

Anybody having suggestions and feedbacks are welcome! I would love to note them down :DD

PS: A suggestion for a new ticket- the website would need graphics and illustrations to keep it engaging and not-so-boring as discussed in the evaluation, so may be we could make a ticket for the cards "content writing", "design", "web dev elopement" having graphics something like the badges including the cute pandas, beefy, crabs. also as @t0xic0der suggested a blurred background of blue fedora logo for the front page, what say @riecatnor ?

Hi @swast1 this work looks amazing! I see you have been working closely with @duffy and @t0xic0der so I will let them continue to guide the process here. Maybe @mleonova would have some feedback on the designs as well :)

This is such a change from the current one and love all the new additions. Great work. In my opinion, I feel the page @swast1 with lists of projects with issues is so easy to navigate while getting an idea on what skills would be needed.

Hey thank you so much for your feedbacks @riecatnor and @ramyaparimi I'm glad you liked it <333 !!
Here's some update on the work:
I made the bugzilla page too. I couldn't decide what to add under the "bugzilla" as there was no such information on the https://fedoraproject.org/easyfix/ and when opening each issue it had a few info but nothing about the skillsets and tags, there were priority and severity tags though.
Also there were no working links or description of how to "contact" the maintainer/assignee, some links are showing errors.

bugzilla.png

@t0xic0der @duffy @mleonova let me know what you guys think about this.
Waiting for your reviews for the previous post too! I made a few comments on them as doubts, looking forward to hear from you!!

The https://pagure.io/design/issue/raw/files/3785a0a9a900bb5f9356f9d97df321cc2887d5d171427c9e662f6326ef0a16ed-bugzilla.png looks so awesome that I can't wait to have this implemented!

There would be some more work needed at the backend side of things due to the introduction of new attributes such as Priority and Severity here at the listing page. We would soon provide you with details as to what should be added as a description to the Bugzilla section. We'll fix the errors related to the links that let you contact the mentor so please be as creative as possible and do not let the bugs hold you down. If you can draw it, we can implement it. :)

@sayaksarkar would love to hear from you, what do you think about the progress made so far by @swast1?

Thank you so much @t0xic0der for the feedbacks, Yes sure I will wait for the details and developements. Sounds great!! excited to improve and refine the work I have done so far, maybe discussing it in one of the upcoming design meets!
Here's some progress till now: I have added the background banner, is this something like you were talking about @t0xic0der ? Although I'm not sure about the accessibility, and that something I'm worried about here, could you guide me with it?

Front_pageui.png

Front_pageui2.png

I was even planning to work on the card illustrations, so maybe while the dev team fixes the bugs I can work on the ilustrations.

On the wireframes, how and where all do you feel improvement is needed @duffy , @mleonova ?

looking forward to your feedbacks @t0xic0der @duffy @mleonova

  • drop the pagure/bugzilla distinction, just rename to "open issues" or something like that
  • introduce a sidebar on the front page (and maybe sub pages) that links to resources rather than have comm blog in the top nav
  • For the different category illustrations, draw some inspiration from the fedora D+I artwork - https://pagure.io/design/issue/737

Thank you @duffy for the feedback

I was having second thoughts about the experience of my wireframes and the iterations so i thought of doing more qualitative user research, and asked two of my open source contributor friends to answer my questions, here is the update:

empathy_points_by_me.pnguserinterviews.png

the other one is the listed remarks and pain pints from my side
I'm working on the wireframes based on these will update in a bit

so the revised front page looks something like this:

Front_page.png

  1. As per my user research I planned to keep the community blog section at the bottom and only on the front page, as contributors wouldn't want to actually look for blogs while finding a project and that comes last on their priority list. I would like to know your views on this that am I correct here ?
  2. I have planned to add a simple short guide kind of thing for very new contributors to understand the process, and have added the link to wiki for more knowledge
  3. Perks was something we had discussed in the heuristic evaluation but I forgot to add so here it is
  4. The get started cta will link directly to the open issue pages, maybe I should add an arrow directing down to encourage them learn by the verticals too rather than putting the cta there, I'm confused here
  5. I added a list of mentors too, which will direct them to a page where there will be the details of the mentor, the issues and projects opened by them. So that a contributor wnating to work under a mentor look into their handled projects and issues and approach from there
    - This card will have a bio, used pronouns, and mailing info of the mentor
  6. I'm even planning to add more personalising features like adding their bios, avatars while logging in or editing their profile
    I find a lot of boxes here, I will eventually get rid of them while designing the UI

Looking forward to hear from you @duffy @t0xic0der @riecatnor

I decided to keep the issue page light and less intimidating with lesser information, and when we click a project box we list out all the issues under it.
The name of the project i meant to be clickable to jump directly to the github/pagure page of the whole project.
The main thing the contributors were looking for was the tags and list of skills and contacting mentors, so that is kept the basic information on the screen.

Issues.png
Issues2.png

Looking forward to your feedbacks and suggestions and iterations!! <33

Hello, hope everyone are safe and doing good!
I worked on the ui of easyfix and here are some updates:
1. I made some more changes on the front page as per the feedbacks given by @duffy .
- i decided to remove the mentors section, I'm still confused if I should keep the community
blogs card at the bottom

Front_pageui.png

I still need to work on the front page cards of projects by verticals (also please let me know if 'vertical' is the appropriate word here)

Issuesui.png

I would love to know your thoughts on these, thank you!

I experimented with the colors:
I have taken the sizes of the cards and illustrations from the community blog page and fedora magazine page, as the aspect ratios were same i thought of keeping it same here as well, I hope it is okay to keep it of the same ratio

Front_pageui1.png

A few more developments on this issue:
I made another set of illustrations for the cards. I'm sorry I'm being a bit dicey here about the decision to make so i'm posting all possible solutions to the problems.

Front_pageui.pngIssuesui1.png

The list of issues UI will show only 5 issues of each project and then with the load more it will show more of them. to avoid the issue of too many issues being opened at a time.
I have a doubt:
The projects on easyfix are mainly development related. Or does it include works from every field?
about the FAQ page, I tried collecting common doubts from my open source contributor friends but I'm not sure if I am allowed to decide the content of the FAQ page but I have made something for it too!
Do let me know your views on this!!
Thank you, take care!

A gentle reminder for the reviews here :D
Any suggestions @duffy @t0xic0der @riecatnor @mleonova on the UI and UX solutions as well as the illustrations?
I'm looking forward to improving and iterating my work here :star_eyes:

Hi @swast1, sincere apologies for the delayed response. There was the F34 release party and then, there was some catching up to do at W&A as well as at Fedora India :/.

  1. For https://pagure.io/design/issue/raw/files/dbfc663c46b4cfe100f85d2f1bf046622919d309e557dd95fe2ac2cf097b514b-Front_pageui.png and https://pagure.io/design/issue/raw/files/5b110fdeffa7578f7ff61ddb04f2fd1765c8f61a6ece3fba7abb2029ee5d3230-Front_pageui2.png, the design looks much better and falls in line with the existing designs for Bodhi and Accounts. You would want to reconsider the background image though, to rework the positioning as well as switching it entirely for the newer one for there's a marked discrepancy between the logo on the navbar and the one in the background.
  2. For https://pagure.io/design/issue/raw/files/33570b7f0ac520a84f4f206ca98b013b893453f0d773ec7954012e5f9b23d817-2.png, I like the background image here as it has the Material-like feel to it, but then again, please cross check if this falls in line with the design guidelines or not before proceeding ahead.
  3. For https://pagure.io/design/issue/raw/files/dfd74a50b4e22398eb951664748cc239fc4d59c988237d698f11e49756235dde-Front_page1.png, the positioning of the Fedora logos in the background is strange enough for me to say that this is a no-go. :(
  4. For https://pagure.io/design/issue/raw/files/6ee6d11dd0a3b890dfc5f44bcfc62ef622be3a6fe020a1a4a86f88694bc5d2a4-fedora_pagureco.png, please add some gradient of grey to distinguish between multiple sections of the list and make varied use of font weights and obliqueness to note the differences between the information displayed there. Also, consider having uniform margin widths and heights across the list box elements.
  5. For https://pagure.io/design/issue/715#comment-727890, please feel free to reach out to folks within the community too to perform user experience research. Folks in the community must have used the Easyfix site at some point in time and are likely to have an idea of things that must be introduced in the redesign.
  6. For https://pagure.io/design/issue/raw/files/04d5cc9788c90a5280e88e7972ceb376f96611ae0a1737bdf5701fa0a8f7a722-Front_page.png, my inclination to "Contribute in 4 easy steps" and "Perks of Participation" section is very weak as those cannot be factually true under a lot of conditions, so please feel free to explain why they should stay back. Please remove the "Mentors" section as there are no dedicated mentors within the community (unless it comes for Mentored Projects) and every contributor is a potential mentor for the newcomers, as long as they are interested to be of help.
  7. For https://pagure.io/design/issue/raw/files/b2e60cebb66758629afa905072481e2e2dfeaa31d44a82a37507c4abd6099aac-Issues.png and https://pagure.io/design/issue/raw/files/d4cfba57137d28cf3a6a67955959ee8c48d984b954a0e627646a7fca4a3ceaee-Issues2.png, I am glad to see multiple shades of grey used to distinguish among stuff but please consider having the contacts division under the expanded view for the projects. Also, please try to use more colours?
  8. For https://pagure.io/design/issue/raw/files/809ef82f657fb0e27d01cb06ade469b5a6084e916b13f50fbb5117f263279c64-Front_pageui.png, this looks much cleaner and better than the previous renditions (and it has a sidebar too!). Where are the users supposed to be led to when they click on the "Get started" button?
  9. For https://pagure.io/design/issue/raw/files/580caafda676685b4eb2ffef8a01be5c9051b328ac4264e3930bfe0befa56b61-Issuesui.png, there is a prominent inconsistency between the Bugzilla issues and the ones from GitHub or Pagure as they have different look and feel to them. Is there a way to give a monolithic feel to them? (Or better yet, have two different vertically-stacked segments for both of them - now that the issues are aggregated based on the projects). There is an underutilization of the right side of the card, so you would want to shift the contact icon there.
  10. For https://pagure.io/design/issue/raw/files/dc2b2283c66aa1d68485e2d89190dc2098c370b8ee208382231597342c9acd9f-it.png, this looks awesome for content writing.
  11. For https://pagure.io/design/issue/raw/files/7ed7e5efcc5fde1bac00912fcecf7e4f428d83d99fdfc7e3ea8462220926e99f-drawing-1.png, this looks too stereotypical from a developer's perspective and is underexplored. Could you please rework this one?
  12. For https://pagure.io/design/issue/raw/files/24186e6610eeeaf078a7bbf73f35d4c92c97dd4fbf193d4b668333271368fd33-bitmap.png, I would let @duffy and @riecatnor take the front seat. The only thing I'd say here is that it can be improved in many ways.
  13. For https://pagure.io/design/issue/raw/files/561544a9a13f385d4c92ce40efb86e5a029e011f54d6dd98d4aabc328d5e918e-Front_pageui1.png and https://pagure.io/design/issue/raw/files/8b61624fbfd85920d3129705b7919534daaeb2e22e7c3d0c29bcc1eaf576370c-Front_pageui.png, thank you for experimenting with the colours but I would still suggest reworking the content inside the vectors first.
  14. For https://pagure.io/design/issue/raw/files/f114e6b1efe1d16d576e36409c9b4194d77e1749e2571e0f17746ee884e09e02-Issuesui1.png, please remove the "Load more issues" and "Load more" buttons as it makes things difficult from the backend development standpoint. Easyfix is a "site" with minimal backend refreshing and regenerating the list of issues every after an equal interval of time, so it does not have the "app-like" features to be able to respond to users whenever requested for. We could, of course, add it but by doing that we are solving a problem that unfortunately does not exist.

As it is difficult to reach out to issues via comment and the entire process of reviewing so far has been passive at best, I would suggest you join #fedora-websites:matrix.org and take up the design proposals over there for review. There would be more folks there to be of your assistance as well when it comes to reviewing.

Hi @swast1, sincere apologies for the delayed response. There was the F34 release party and then, there was some catching up to do at W&A as well as at Fedora India :/.

Yes I understand totally, it's alright even I got time to explore more on this!!

  1. For https://pagure.io/design/issue/raw/files/dbfc663c46b4cfe100f85d2f1bf046622919d309e557dd95fe2ac2cf097b514b-Front_pageui.png and https://pagure.io/design/issue/raw/files/5b110fdeffa7578f7ff61ddb04f2fd1765c8f61a6ece3fba7abb2029ee5d3230-Front_pageui2.png, the design looks much better and falls in line with the existing designs for Bodhi and Accounts. You would want to reconsider the background image though, to rework the positioning as well as switching it entirely for the newer one for there's a marked discrepancy between the logo on the navbar and the one in the background.

Yes, I was not sure of the background myself I was just exploring with the blur blue background idea

  1. For https://pagure.io/design/issue/raw/files/33570b7f0ac520a84f4f206ca98b013b893453f0d773ec7954012e5f9b23d817-2.png, I like the background image here as it has the Material-like feel to it, but then again, please cross check if this falls in line with the design guidelines or not before proceeding ahead.

Hmm fair enough, it was just an experiment but I needed some direction if I'm doing it correctly.

  1. For https://pagure.io/design/issue/raw/files/dfd74a50b4e22398eb951664748cc239fc4d59c988237d698f11e49756235dde-Front_page1.png, the positioning of the Fedora logos in the background is strange enough for me to say that this is a no-go. :(

:thumbsup:

  1. For https://pagure.io/design/issue/raw/files/6ee6d11dd0a3b890dfc5f44bcfc62ef622be3a6fe020a1a4a86f88694bc5d2a4-fedora_pagureco.png, please add some gradient of grey to distinguish between multiple sections of the list and make varied use of font weights and obliqueness to note the differences between the information displayed there. Also, consider having uniform margin widths and heights across the list box elements.

Agreed , it needs some hierarchy

  1. For https://pagure.io/design/issue/715#comment-727890, please feel free to reach out to folks within the community too to perform user experience research. Folks in the community must have used the Easyfix site at some point in time and are likely to have an idea of things that must be introduced in the redesign.

Noted.

  1. For https://pagure.io/design/issue/raw/files/04d5cc9788c90a5280e88e7972ceb376f96611ae0a1737bdf5701fa0a8f7a722-Front_page.png, my inclination to "Contribute in 4 easy steps" and "Perks of Participation" section is very weak as those cannot be factually true under a lot of conditions, so please feel free to explain why they should stay back. Please remove the "Mentors" section as there are no dedicated mentors within the community (unless it comes for Mentored Projects) and every contributor is a potential mentor for the newcomers, as long as they are interested to be of help.

Right, I took some review from my FOSS contributor friends and decided to remove it in my next iterations.

  1. For https://pagure.io/design/issue/raw/files/b2e60cebb66758629afa905072481e2e2dfeaa31d44a82a37507c4abd6099aac-Issues.png and https://pagure.io/design/issue/raw/files/d4cfba57137d28cf3a6a67955959ee8c48d984b954a0e627646a7fca4a3ceaee-Issues2.png, I am glad to see multiple shades of grey used to distinguish among stuff but please consider having the contacts division under the expanded view for the projects. Also, please try to use more colours?

Yes of course!! These are hi-fi wireframes.

  1. For https://pagure.io/design/issue/raw/files/809ef82f657fb0e27d01cb06ade469b5a6084e916b13f50fbb5117f263279c64-Front_pageui.png, this looks much cleaner and better than the previous renditions (and it has a sidebar too!). Where are the users supposed to be led to when they click on the "Get started" button?

The get started button takes the user to the list of open projects page directly

  1. For https://pagure.io/design/issue/raw/files/580caafda676685b4eb2ffef8a01be5c9051b328ac4264e3930bfe0befa56b61-Issuesui.png, there is a prominent inconsistency between the Bugzilla issues and the ones from GitHub or Pagure as they have different look and feel to them. Is there a way to give a monolithic feel to them? (Or better yet, have two different vertically-stacked segments for both of them - now that the issues are aggregated based on the projects). There is an underutilization of the right side of the card, so you would want to shift the contact icon there.

Hmm, agreed. I will balance out the cards, one side seems a bit more busy now. May be I could make the bugzilla cards same as the pagure ones and add a bug tag there. I did not add another vertical or page for it as duffy had mentioned it to combine both the elements together.

  1. For https://pagure.io/design/issue/raw/files/dc2b2283c66aa1d68485e2d89190dc2098c370b8ee208382231597342c9acd9f-it.png, this looks awesome for content writing.
  2. For https://pagure.io/design/issue/raw/files/7ed7e5efcc5fde1bac00912fcecf7e4f428d83d99fdfc7e3ea8462220926e99f-drawing-1.png, this looks too stereotypical from a developer's perspective and is underexplored. Could you please rework this one?

Right, I'm so sorry for the mistake I will explore more for the illsutration.

  1. For https://pagure.io/design/issue/raw/files/24186e6610eeeaf078a7bbf73f35d4c92c97dd4fbf193d4b668333271368fd33-bitmap.png, I would let @duffy and @riecatnor take the front seat. The only thing I'd say here is that it can be improved in many ways.

If the issue is with the illustration, I only had the illustration provided by duffy to use here and so I was a bit restricted. I could explore more as @duffy and @riecatnor suggest.

  1. For https://pagure.io/design/issue/raw/files/561544a9a13f385d4c92ce40efb86e5a029e011f54d6dd98d4aabc328d5e918e-Front_pageui1.png and https://pagure.io/design/issue/raw/files/8b61624fbfd85920d3129705b7919534daaeb2e22e7c3d0c29bcc1eaf576370c-Front_pageui.png, thank you for experimenting with the colours but I would still suggest reworking the content inside the vectors first.
  2. For https://pagure.io/design/issue/raw/files/f114e6b1efe1d16d576e36409c9b4194d77e1749e2571e0f17746ee884e09e02-Issuesui1.png, please remove the "Load more issues" and "Load more" buttons as it makes things difficult from the backend development standpoint. Easyfix is a "site" with minimal backend refreshing and regenerating the list of issues every after an equal interval of time, so it does not have the "app-like" features to be able to respond to users whenever requested for. We could, of course, add it but by doing that we are solving a problem that unfortunately does not exist.

I will surely remove them. The thought behind this was that some of the projects have upto 20-25 or more issues. If a person selects the project by mistake they open the whole list of the issue which may get them lost. same for the whole list of projects, they are many and finding by scrolling down and back up could be a difficult task.
Is there any possibility we could add pages? This might help us solve this problem.

As it is difficult to reach out to issues via comment and the entire process of reviewing so far has been passive at best, I would suggest you join #fedora-websites:matrix.org and take up the design proposals over there for review. There would be more folks there to be of your assistance as well when it comes to reviewing.

Right @t0xic0der noted. I would love to refine it with more inputs. Thank you so much for the efforts and taking your time to go through work here, I really appreciate it. I will come up with new solutions on these following your feedbacks here.

Hey @swast1 , I'm just starting to plan out the frontend code revamp based on your mockups. I wanted to clarify a bit on user workflow.

  1. when the page is first loaded, does it open this https://pagure.io/design/issue/raw/files/561544a9a13f385d4c92ce40efb86e5a029e011f54d6dd98d4aabc328d5e918e-Front_pageui1.png

  2. and then when the user clicks on the cards, does it take them to https://pagure.io/design/issue/raw/files/f114e6b1efe1d16d576e36409c9b4194d77e1749e2571e0f17746ee884e09e02-Issuesui1.png

  3. or is the mockup in point 2 where the user goes from the "Open Issues" link in the sidebar?

Thank you for your time :)

Login to comment on this ticket.

Metadata
Attachments 29
Attached 3 years ago View Comment
Attached 3 years ago View Comment
Attached 3 years ago View Comment
Attached 3 years ago View Comment
Attached 3 years ago View Comment
Attached 3 years ago View Comment
Attached 3 years ago View Comment
Attached 3 years ago View Comment
Attached 3 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment
Attached 2 years ago View Comment