Menu
Logged-In As
ACCOUNTNot Logged In
Code a Front-end style guide for BRL-CADBRL-CAD
Status: ClosedTime to complete:
100 hrs
Mentors: Sean, Gauravjeet Singh, Ishwerdas
BRL-CAD is working on it's new website. The original design is at cpp-tricks.com/brlcad and beta.brlcad.org/wp/.
Your task is to generate a Front-end pattern library for new website. A pattern library is kind of a style guide where all the styles that are to be used in website are depicted on one page. I contains all the possible markups that we may use, how will images be styled and so on. You can look at sample libraries here https://gimmebar.com/collection/4ecd439c2f0aaad734000022/front-end-styleguides.
References:- https://gimmebar.com/collection/4ecd439c2f0aaad734000022/front-end-styleguides
- http://patterns.alistapart.com/
Uploaded Work
File name/URL | File size | Date submitted | |
---|---|---|---|
BRL-CAD Front-End Pattern.zip | 9.5 KB | December 09 2014 17:17 UTC | |
hopethisoneuploads.zip | 9.8 KB | December 10 2014 13:04 UTC |
I would like to work on this task.
This task has been assigned to Marc Tannous. You have 100 hours to complete this task, good luck!
This might not seem like much, but this took CSS-writing to a whole new level for me, as it was just like writing my own coding language, for other's use and it was great.
Came up with a few categories, spent a while researching the new website and divided my tasks accordingly, and then jumped straight to coding. It might seem small in comparison to the links you have provided, mainly because BRL-CAD's website is still in a beta phase and does not have much content. But I have implemented more than meets the eye, figuring out a way to how I can color my buttons,text everything else by only adding one more class, and added the whole color-palette as that. So, for example, if I wanted a pink paragraph, I could have it, if I wanted a light gray or white big text header, I could also have it.
This was awesome, waiting for your feedback.
The work on this task is ready to be reviewed.
Marc, this indeed really nice, so I'll just right to the things I notice. Don't let that minimize the appreciation of your effort -- this is awesome.
So what I notice right away is that the left menu seems to violate this style guide, no? :) The menu color is not on the approved color list. That said, the pink used in your write-up doesn't look quite right either. Not entirely relevant to the guide as we can just plug in different number values, but it's interesting to see this pinkish color evolve from different designers. The colors here are a little closer to truth/desire: http://www.stickermule.com/marketplace/2692-brl-cad-gear-logo
Also (and probably the only area to improve), there seems to be no guidance on how to put this information to use, i.e., that you created css classes to stylize content or what the design requirements are (you say for colors, but not what kinds of typography/fonts are okay, for example). Basically a brief intro or explanation is in order.
One of the mentors has sent this task back for more work. Talk to the mentor(s) assigned to this task to satisfy the requirements needed to complete this task, submit your work again and mark the task as complete once you re-submit your work.
The work on this task is ready to be reviewed.
Color changed to the one in the link you provided, now it should be consistent across the page. Added a brief introduction called "Usage", not going into too much detail but specifying all that needed to be specified. I want to have typography left like this to be honest, not mentioning a specific font as all of these have Open Sans implemented in them.
Regards,
Marc
One of the mentors has sent this task back for more work. Talk to the mentor(s) assigned to this task to satisfy the requirements needed to complete this task, submit your work again and mark the task as complete once you re-submit your work.
You didn't upload anything. ;)
Also, with regards to the typography, it could be as simple as saying Open Sans (nothing wrong with standardizing on it) or specifying a preference towards sans serif fonts. That's certainly not a given with a broad enough audience.
I was in a hurry to upload and mark it done before leaving for school, must have missed the upload button. I will add the specifications under typography and hopefully be able to upload this time, when I get home in abou 6 hours.
The work on this task is ready to be reviewed.
Looks nice and polished, you did apply Sean's feedback, also consistent with other guides you have done.
Thank you for your effort! Task closed!
Congratulations, this task has been completed successfully.