I am sure that I will get my Elm skills refreshed quickly based on my past FP experience and some rescript-react experience. The main thing that I feel that I am lacking is experience coming up with basic UI’s (figma or framer mockup or the initial layout in html/elm), as I primarily have built backend systems.
Any suggestions for quick exercises that I can do to ramp up there - should I just focus on designing a wide variety of UI’s in Framer? should I go for ugly, but functional designs in Elm and HTML, possibly in Ellie? Something else? I am trying to fill in the gaps to go from mostly back end to a real full stack engineer.
From a web designer’s perspective, It all goes down on how you learn and use CSS as the presentation layer for the web. CSS Zen Garden is one of the oldest and most updated resources to learn every aspect of a design language.
From a user interface’s perspective, It all goes down on how you approach Normal Flow, Flexbox and CSS Grid as the main layouts for the web.
In both of above cases, there is no need for external tools out of the core web technologies. Although, It’s good practice to save your progress on services like CodePen for ease of sharing and future references. Then, you may return to the full-stack realm and use your tools to integrate this core knowledge into whats appropriate for your projects. In case of Elm, this is my proposal for integration:
Note: At the time of writing, I’m at the second phase of my proposal and everything works well through different projects. I’m also doing my best to watch for accessibility in each phase. For quick exercises, have a look at Codepip games specially Flexbox Froggy and Grid Garden.
I feel comfortable going from framer/figma to css and html. I am hoping to build up more skills for getting from high level user need to framer/figma mockup.
A a former “backend inly” engineer, what I finally realized is that there is no magic to UX. It’s just hard work and different problems that can be very challenging. A lot of experimentation and trial and error and getting feedback from others and seeing how they react…
Unless you’re going to be both the designer and developer on the project then I don’t think it’s absolutely necessary that you be able to come up with UI’s. Frontend Mentor can help you with that. Pick a few challenges you like and go from there. If you do end up completing one of their challenges using Elm I’d be happy to share it on Built with Elm.
Unless you’re going to be both the designer and developer on the project then I don’t think it’s absolutely necessary that you be able to come up with UI’s.
I agree with this sentiment, but sometimes I want to brainstorm ideas with product owners directly.
I will try the Refactoring UI book as well as iterating on lots of small UI problems. I was just hoping that there are common exercise problems that entry level UX designers sharpen their skills on. I can come up with my own problems though.