Design Submission Management page

[birdofpreyru]

Brief: @ajefts gave me the task to move Design Submission Management (DSM) page from a legacy TC repository to the new code, updating on the way technologies and APIs it uses. From DaraK I know that there are some new designs for this page, but I have not seen them yet, as DaraK waits for @vic-topcoder permission to share them with me. I've also contacted with @adroc-tc, mahestro, @Ravijune, and @f0rc0d3r to ask about ideas what should be changed/enhaced in the functionality provided by the current DSM page (which does not provide much features, just downloading, removing and re-ordering submissions, and mahestro told me that ordering is not really used further when copilots handle these submissions).

I'm starting this thread to collect the feedback from everybody to understand what do we need in DSM page. I'll take care to make your dreams to come true (well, technical/frontend part... for any design/drawing staff I'll need support from designers, for any non-trivial staff related to the backend, I'll need support from the guys involved in making TC API v3).

[Dara-K]

I have just shared the designs with @birdofpreyru . In my designs I also included screening status, because we have to go to Online Review and many new members don't know where that is + it's faster. If user has warnings he can see the details there / or if he failed. The score would make no sense as if it's failed he cannot submit, while for warnings he can still submit in R2.

https://www.dropbox.com/sh/u750uwibxzpcnup/AAB1QXW4l6V7OP6Hff3G_oS6a?dl=0

Vic said that they are going to launch concept challenges for challenge details page soon which will include the management part as well.

[birdofpreyru]

It looks lovely! mahestro mentioned that it would be nice to be able to see/edit fonts/stocks details at that page. I see, we can add such functionality in details panel, which opens for each submission by arrow in the actions column.

[birdofpreyru]

What is the goal of additional concept challenges? Are you looking for some radical changes for that page?

[Dara-K]

Thanks! I am not sure user should be able to edit them after they uploaded their submission. Those details are submitted until deadline, not after. Maybe viewing will make things easier for members when declaring files in round 2 to copy the photo/fonts declarations from round 1.

@adroc-tc thoughts?

[vic-tian]

@birdofpreyru We're in the process of doing product discovery on the project details pages. There are several reasons we want to take a look on those:

• transition away from Wordpress as storage/template engine
• bring all challenge types on the same system
• fix know problems of the existing page
• bring all challenge-related items on the same page — submissions management, discussions, links to review, etc. — so the users will have a much better experience
• push forward for new functionality and enhance the business model.

In regards with the design management — we have designed the experience with Filipp & @Dara-K, it is good to go. We might want to consider the plan on how the style will fit the current page and the new redesigned pages. The current design is going to say for a while until we are ready with the redesign and fine functionality list. Let's create a new project on Connect and continue figuring the details there, and make a connection to this issue so we can better discuss the appropriate details.

[birdofpreyru]

@vic-topcoder Here is the Connect project: https://connect.topcoder.com/projects/1138

[Dara-K]

Another idea would be to have an option for designers to copy/duplicate/reuse fonts and istockphotos declarations from round 1 to round 2. This would make things faster for submitting as will save us time.

[birdofpreyru]

Can you explain me a bit more about how it works now?

So, you have 2 rounds in a challenge. For the first one you can submit multiple times, you get feedback, and you work further. Round 1 submissions stay in the system? So, once you are ready to go, you just upload new submissions and rank them higher than round 1 submissions? Thus, eventually, before the end of the second round, you will have all your submissions for both rounds in the same page, and just having for each of them a button like copy fonts/declarations from another submission, is enough to implement this functionality?

Then, what you saying about modifications to these declarations... in principle, you meant that we should not allow to modify declarations for 1-st round submissions during the second round. But, if you have upload anything during the ongoing round, it seems ok, to allow to edit these, rather than have to re-appload the whole submission, if you made a mistake in the declarations?

[Dara-K]

We have 2 rounds for most of the challenges (not all). We submit in round 1 and we attach the designs JPGs/PNGs , the sources and a preview file. On same page we have to declare the fonts we used and the istockphotos. Once checkpoint round closes, we cannot edit any file or declaration - it's a time management thing. If we don't declare some fonts or photos, we fail screening and our submission won't be shown to client to get feedback. The copilot/PM will probably provide himself feedback, but it's still not the client. Failing screening from these reason is a minor issue so we can still submit on round 2 if we fix the declarations.

On round 2 we work on adding new pages and improving the previous one with feedback. When we submit for final deadline, we would usually declare same fonts like before and usually a large part of istockphotos(unless client didn't like a specific one). So by either having a button to copy/paste the previous declarations or maybe have the previous fonts and istockphotos automatically selected on the submit page, with an X at the end/option to delete them and add new ones, we would save some time. We should think at finding the best/easy/intuitive way to do this.

I attached a file for you to see how our submitting page looks now. Let me know if you got questions.

[birdofpreyru]

Ok, got it, thank you. Do you have .svg assets for the icons in your design?

[Dara-K]

Yes. The design was done in Sketch and have a few ways to export them.

[birdofpreyru]

Sketch? Is it that tool, which allows to have an html document, which shows the design pictures, and when you click elements, it shows what the colors/dimensions and other params of the selected elements are? I definitely need it. And also .svg files with icons.

[birdofpreyru]

@adroc-tc @vic-topcoder @Dara-K

Here is my rapid sketch of what I would add to the design, based on what I have heard and seen so far:

1. Submission Details section, which can be open/hidden for each submission by that arrow in action columns, together with the Screening Warnings section. We can allow to edit everything in that section until the end of the challenge phase in which that sumbission was uploaded. In the next phases we show it as read-only.

2. A bunch of drag'n'drop handles all arond, which would allow (a) re-order submissions, and font/stock declarations within a single submission details (if editable); (b) to copy font/stock declarations (entirely, or individual items) between submission by dragging them from source submission to the one, where we want to copy them.

[birdofpreyru]

Also, when the mouse hovers over the preview thumbnail, we can show the full-size preview in a big tooltip (covering most of the screen). DaraK told me yesterday, that it is not that necessary to anybody, but it is simple to implement, and makes the page more interactive.

Also, we can have tooltips for all icons and drag handles on the page.

[vic-tian]

We're currently developing the first version of the submission management pages! Woot! Great job, @birdofpreyru and @Dara-K!