Updates on the Frontend Mentor platform, plus some big news!

Matt Studdert
Frontend Mentor
Published in
5 min readAug 2, 2019

--

It’s been a busy first half of 2019. From starting the platform build in January to launching it in April and then seeing user numbers grow and grow, it’s been an exciting time!

Doing all of this while still doing contract work and teaching has meant that I’ve neglected certain aspects, one being this blog!

So here’s an update that I hope you’ll like. I’ll also be giving another update in the coming weeks with more details about a new feature that I’m excited to launch.

Solution submission

It’s been so great to see everyone submitting their solutions on the platform. Seeing people submit solutions for multiple challenges and making improvements each time makes me so happy. The goal behind Frontend Mentor is to give people a real-world experience of building projects to a UI design. So it’s awesome to see people building their confidence in taking a design spec and running with it.

There has been one thing missing though, which I feel could potentially be limiting the interactions on the platform when giving feedback. Before, if you were to submit your solution there was no way to also ask questions about your code. Allowing you to ask specific questions about your code could lead to much more targeted and useful feedback being given.

Therefore, I’ve updated the solution submission form to include a “Questions for the community” field where you can write questions about anything you’re not sure of and would like help on.

This field will support markdown as well, so you can write code blocks or whatever you like in order to help ask your question.

I’ve also updated the layout of the submission form, which you can see below:

New layout for submitting a solution

You’ll also notice that the “What key lessons did you learn during this challenge?” field has disappeared. I’ve decided to remove it, as it didn’t seem to be adding a huge amount of value. I feel there is definitely something that could be done by allowing you to document what you learned during the challenge. But the short key lessons fields didn’t seem to be doing the job.

There could be the possibility of allowing you to journal your experience completing the challenge, almost like a small blog post.

I’m open to any ideas on this, so please feel free to get in touch if you have any thoughts.

Solution page

I’ve completely re-worked the layout of the solution page, hopefully making the layout more intuitive and also adding a couple of new options.

Now that you’ll have the ability to ask a question when you submit your solution, the question will show up just above the feedback area.

Design for the new look solution page

I haven’t implemented all of the changes in this design yet, so the real page will look a little different.

Coming very soon

I’m going to create a sharing page for your solution so that you’ll have easy sharing options with pre-filled text for different platforms like Slack, Twitter, and LinkedIn. These will help you share your solution, increasing the chances of getting feedback from other developers in the community and also showing off your work!

There will also be a page where you can see the rest of the community’s solutions for the challenge that you’ve completed. Seeing how other people completed the same challenge will be a great learning opportunity. Reading other people’s code and seeing different approaches to the same problem will help you build an understanding of a variety of possible solutions.

Smaller tweaks

You may also notice some smaller additions as you navigate the site. I’ve added these just to improve the general user experience of the platform.

Mentions

You can now mention other users on the solution feedback threads. This will ensure they’re notified about your message keeping the conversation going.

Solution feedback now has mentions

Markdown syntax helper

The new questions field supports markdown, as does the solution feedback thread fields. So I’ve added a little helper box that you can click on if you’re not sure of what markdown you can add and what the syntax is. Just keep an eye out for the little keyboard icon to the top-right of an input.

New feature

There is also another entirely new feature on the horizon! I’ve mentioned it a few times in the Slack community and on the newsletter, so it may not be a surprise to all of you.

The Frontend Mentor platform is soon going to be adding an automated reporting feature for your solutions.

This means that you’ll be able to gain insights into your code immediately after submitting or updating your solutions.

I’ll be writing a complete blog post about this new feature in the coming weeks and I’m really excited to get the first version live on the platform.

In the meantime, here’s a sneak peek at how the solution page when viewing your own solution once the sharing and community solution pages are complete and when the reporting feature is live:

The new-look solution page with sharing, community solutions, and report

Feedback welcome

I’d love to hear your thoughts on these new additions to the platform, so please do leave a comment or email me at matt@frontendmentor.io.

Newsletter and Slack community

Stay up-to-date with the latest news and featured solutions by subscribing to the newsletter. You can also join over 1,300 other front-end developers in the Frontend Mentor Slack community.

--

--

Matt Studdert
Frontend Mentor

Front-end/JavaScript developer who loves to build useful products. Creator of Frontend Mentor (https://www.frontendmentor.io).