Why are we 3-4 years behind on UI proto technology?

[hokienick]

Topcoder should be leading the way in technology

[hokienick]

@adroc-tc understands this situation. However, he wants copilots and all of us to help clients get excited about the use of new technology. We would need standardization for members.

[Sande3p]

Review techniques/standards are older that forces coders to follow the older techniques in order to win. Less focus is given on performance, consistency...

[Sande3p]

Lack of collaboration between design & UI coders.

• Generally in storyboards spacing, padding, margin, colors, font-size... have small inconsistencies.
• Let's say In some PSD header padding is 20px & at footer padding changes to 18px.
• During UI development coders have use these inconsistent values to get full scores.

[vic-tian]

I am preparing a series of blog posts on the subject - how to design for code and think in containers, what is the advantage of React and reusable modules, and what do we use on our front-end stack to make it easy to add/modify new components without huge dependency on nested (S)CSS.

I think that we use whatever technology the challenge calls for, to match the requirements. It is good to think about the cutting-edge technology and experiment with it, but if your prototype is going to be consumed in a specific way by a specific customer/challenge sponsor, than what they are really comfortable with should be the norm.

[Sande3p]

Why don't we just start a dedicated site like topcoder-ux.com listing the tc UX & other similar things. So that coders/ designers/ copilots/ reviewers can easily find info. abt. the elements used on tc site. This can help in developing consistent sites/components faster.

[vas3a]

Totally agree with @Sande3p on this one:

Review techniques/standards are older that forces coders to follow the older techniques in order to win. Less focus is given on performance, consistency...

You really need to find a solution for issue #52 if you want to use top technologies.

[lstkz]

I reported this issue more than 1 year ago, so I am updating the title :D

[lstkz]

@Sande3p
We can keep all standards in a dedicated gitub repo. It will be much easier to contribute.

@vic-topcoder
'components', not 'containers' :)

IMO it's hard to create strict standards for standard HTML + jquery apps.
It will be always hard to migrate it to frameworks like angular or react.

[vic-tian]

@lsentkiewicz I agree partially. The designers might not know how a design will be created into a component-based front-end. That's why I leave the application architecture to the engineers, and think about the containers and what is repeated, what are all the states of a container, what are the unique and which are the repeatable elements. Being able to determine those would help to present the design thinking for the engineer who will create the component architecture based on the container logic of the designer. Most of the time engineers create a different structure as they know the inner workings of the system, take into account state management and others (can't pretend I understand everything about front-end).

It is hard to stick to standards, or enforce them community-wide. That's why online review is important. It also depends if we build 1-off prototype that illustrates what the app/website needs to do, vs. continuous integration — building within a established system/production software. I have no solution for the second scenario, rather than the above mentioned blog posts with the thinking/methodology above, and stricter online review process.

[Sande3p]

@lsentkiewicz: GitHub works best & we can also use libraries/plugins that can parse the *.md files into html code that can be hosted on topcoder.com. Recently I saw the polymer site: []https://www.polymer-project.org/2.0/docs/about_20 . They were using similar technique.

@vic-topcoder: I use Adobe's Creative Cloud to upload PSDs before start working. The problem with most of the PSDs is that they are huge & at first it's required to break them into smaller fragments & then upload to Creative Cloud.