Task Request: Kindly Help Us Tend To 14 Micro-Programming Tasks To Enhance The Overall steemgigs.org UX
SteemGigs: A Revolutionary Decentralized Freelance Marketplace With Its Own Knowledge-Bank.
A revolutionary freelance marketplace built on the steem blockchain that removes all barriers to entry, by implementing an "untalented & community paradigm".
This task is a series of micro-programming tasks. The task covers the following:
- Add Corresponding Text To Each Drop-down Item Of The 'create' button On Steemgigs.org
- Add A 'Choose Reward/Payout' Button To All Other Editors Across steemgigs.org
- Add Some Styling & Text-Formatting To The Style-Guide Area (on the right-side) Of Each Editor Across steemgigs.org
- Revamp Some Areas Of Each Editor Under steemgigs.org/surpassing-google
- Add A Check To All Our Post Editors (where required), To Create Unique Permalinks For Every Post.
- Fix The Sorting Function On Our Homepage
- Show Post Payout Even Post-7days
- Add a Social Share Button To Post
- Adjust The Metatag Of steemgigs.org
- Allow steemgigs-based URL To Render A Preview
- Adjust Image Sharpness
- Please Add A 'Follow' tick-button Prior To Login
- Fix A UI Bug On Our Homepage Prior To Login, That Doesn't Allow The Page To Scroll Up/Down
- Kindly Help Us Add A 'Certified Ulogger' Badge & Functional 'Delegate' Button, Underneath The Posts Of Certified Uloggers Who Post Through steemgigs.org
If you would like to contribute to our project, we are now adopting a new style of contribution.
If you are designated to undertake the entire task or any of the sub-tasks, we would like you to be able to send a PR to our repository each day, however small your coding-contribution is. Alternatively, you can provide us with a repository, where we can monitor your progress each day.
This will give us an avenue to inspire you (where needed) to stick to the time-allotment for the task or move on fast, where you are not able to actively contributing.
Note: This task request is also done via utopian.io
1. Add Corresponding Text To Each Drop-down Item Of The 'create' button On Steemgigs.org
We now have a 'create' button on the top-right area of steemgigs.org, that contains a drop-down, linking to our list of editors.
When users click on the 'Create' button to select an editor, we now want to give them some insight into the function of each editor on the drop-down list, so that they can chose an appropriate editor. To this effect, we want to add a '?' or 'More Info icon' beside each item on the drop-down, containing information about each editor.
Users may be able to click on this '?' icon etc to gain quick insight about each item on the drop-down list.
Raw text for each item
Gig: Offer a service (related to your expertise, talents/un(dis)talents, experience etc) in exchange for Steem, SBD, Steem Power or for free.
Custom Request: If you can't find the exact gig that you seek, you may want to do a custom request. Try this editor.
Testimonial: Share your overall SteemGigs experience with us. So, why not record your service progress & updates, successful deliveries, shout-outs, payments etc using this editor.
Untalented: Not an expert yet? No worries! On SteemGigs, you can hone your expertise while offering a service. Select this editor to do just so.
SurpassingGoogle: Select this editor to contribute knowledge (based on your experience), specific to a niche, field, industry, expertise etc to our knowledge-bank.
2. Add A 'Choose Reward/Payout' Button To All Other Editors Across steemgigs.org
Currently, only the 'Create Gig' editor has the option that allows users to chose a payout method as seen on the screenshot below:
However, there are many editors across steemgigs.org and none of these other editors have the 'Choose Reward/Payout' button.
Note https://steemgigs.org/surpassing-google alone links to some 12 different editors.
We now like you to add a 'Choose Reward/Payout' button to all the other editors across steemgigs.org as seen in the earlier image.
3. Add Some Styling & Text-Formatting To The Style-Guide Area (on the right-side) Of Each Editor Across steemgigs.org
Each editor across steemgigs.org has a style-guide area (towards the right-side) as seen in the screenshot below:
Each aspect of the editor has its corresponding style-guide.
In this task, we would like you to add some styling/design/color to this area for a better user experience. Where possible, you can also adjust the font and add some text-formatting.
Speaking of styling/design, we would also like the corresponding text-box for each aspect of an editor, to be aligned in height (with the portion of the editor that it is meant for).
Something like this:
Besides, as part of the design, you can make use of fitting icon(s) e.g the text-boxes may have a lamp icon etc
But there is more......
4. Revamp Some Areas Of Each Editor Under steemgigs.org/surpassing-google
If you visit each of the editors under https://steemgigs.org/surpassing-google, you will notice that it has some UI/design-bugs. This may have something to do with the browser type i am using (i am using firefox) but maybe not.
Please test using different browsers to be sure it is not a browser-rendering issue.
You will notice that the style-guide/text-boxes (on the right-side) is so right-ward, that it becomes impossible to scroll down on the page. Too, the only way to see the later part of the post editor is to zoom the screen out and even so, you really can't scroll up/down on the page.
This UI/design malfunction is evident on all the editors under https://steemgigs.org/surpassing-google
If you take another a closer look, you will also notice that each of the editors under https://steemgigs.org/surpassing-google share a similar structure. For instance, you will notice that the header area of each of these editors, that carries the editor-title has some part cut off.
See these images:
Kindly look into fixing all the aforementioned!
5. Add A Check To All Our Post Editors (where required), To Create Unique Permalinks For Every Post.
In a recent test, while using one of the editors on steemgigs.org, i noticed that the different editors across steemgigs.org may not have the ability of designating a unique permalink for different posts, in the coincidence that a particular user creates two similar posts, using different editors, where each post carries the same first tag and title.
During my test, i attempted to create a post using a different editor (Untalented Editor) than the 'Create Gig' editor. Coincidentally, i titled the post, 'Test Post', which had exactly the same title as a post that was created 9 months ago, using the 'Create Gig' editor. In both cases too, the first tag was #steemgigs!
The result? My post appeared to publish successfully on steemgigs.org and this case was evident even on steemd.com/@steemgigs but i wasn't able to locate the post on steemit.com or on steemgigs.org and steemd.com/@steemgigs ended up linking me back to the post that was published some 9 months ago.
Ultimately, what happened is, "both posts had exactly the same permalink".
Kindly add a check to the code that makes sure that every post created on whatever post-editor across steemgigs, has a unique permalink.
6. Fix The Sorting Function On Our Homepage
We would like the 'sorting' function on the various segments of our homepage, to work.
In this task, simply make the 'sort' button work, similar to how this function works on steemit.
7. Show Post Payout Even Post-7days
Currently, posts show a payout of '0.00$', post-7days. We would like this to change.
We now want posts and post-cards across steemgigs.org to display actual payout, regardless of post-age.
8. Add a Social Share Button To Post
Kindly add a social share button to the bottom of posts across steemgigs.org
For now we would like to add buttons for Facebook, Twitter & Reddit as is the case on steemit.com
9. Adjust The Metatag Of steemgigs.org
Currently, steemgigs doesn't show much when it comes to a metatag. In the search engines, it simply shows this:
We want to replace 'everyone has something to offer' with the text below:
A revolutionary freelance services marketplace built on the steem blockchain, that 'removes all barriers to entry from dream-building' for entrepreneurs, by implementing an 'untalented & community' paradigm, where 'everyone has something to offer'.
10. Allow steemgigs-based URL To Render A Preview
Currently, when you share a steemgigs.org-based URL e.g on Facebook, Twitter, Discord etc, it is unable to load up 'a preview'. We would this to adjust.
When users share share our URL, it should load up an appropriate preview. Something like this:
11. Adjust Image Sharpness
We would like you to check the image-rendering mechanism across steemgigs.org and apply a possible solution to the low-image-quality apparent currently, across steemgigs.org
It appears that images are extremely compressed and lose quality to a maximum measure. We would like you to fix this.
12. Please Add A 'Follow' tick-button Prior To Login
When users attempt to login, we would like a simple portal to show up (as part of the login process), if they haven't followed @steemgigs yet.
13. Fix A UI Bug On Our Homepage Prior To Login, That Doesn't Allow The Page To Scroll Up/Down
If you visit steemgigs.org (prior to login), you will notice that our landing page doesn't have the scroll function on the right side, that allows users to scroll up/down (navigate) the entire page.
Kindly help us fix this!
Please test on various browsers to be sure it is not a browser-rendering issue.
14. Kindly Help Us Add A 'Certified Ulogger' Badge & Functional 'Delegate' Button, Underneath The Posts Of Certified Uloggers Who Post Through steemgigs.org
This means that certified uloggers will have exclusive perks/add-ons across any of our interfaces. We want to begin to experiment with algorithms that apply this, on steemgigs.org as well
Many of such-like algorithms has already been implemented on ulogs.org
In this task, we want to add a 'certified ulogger' badge and a functional 'delegate' button to the bottom of every post authored on steemgigs.org by certified uloggers
See sample image:
Analyzing the current code is a good starting point. For task 14, you may want to look at ulogs.org or its code as this will help you explore options. Also across the entire task, it is essential to test your code on different browsers to make sure the end-product renders well on different browsers.
You can decide to take one or more tasks. Kindly indicate your intention in the comment section below. Where you get stuck, we can always discuss possible solutions, logic etc We just may find answers!
Overall, carry out the task according to your preference and expertise, submitting a pull request and thereafter create a post highlighting your contribution, following Utopian's guidelines for Development (contributions).
(For the entire task) 4 days
You can contact me on:
You can also indicate interest by leaving a comment underneath this post or on Github.
It is recommended that we are able to discuss, for a better understanding of the task.