You have to start somewhere, and this is there.
In my time from developer to engineer to designer, I've gone through many iterations of a personal portfolio. I wanted to approach this one with much more intention, and have it be representative of the direction I'm making my way towards - personally and professionally. So, I decided to use it as an opportunity to learn, showcase, and develop the skills I have not only wanted to develop, but will become necessary.
What does that mean in this context? For starters, I didn't want to throw away my background as a developer and engineer. These are valuable and fundamental aspects to how I've grown. I especially have loved keeping those skills fresh in the context of web development, and I believe that gives me a valuable insight into the design process when handing off high-fidelity mock-ups to developers. So, in order to evolve and keep these skills, I wanted to build this website using something new: Svelte and SvelteKit. I found this new tool to be extremely helpful to use when iterating over similar aspects that needed to be placed around the website. Also, they had a great tutorial that provided everything you need to know.

Svelte Tutorial
I want to be a product designer. Maybe I could get away with some transferrable skills from developer to engineer, but with the changes I want to make, I knew I'd have to learn the design skills necessary, and fast. So this where my real intention starts. I started prototyping in Figma, and looking at beautiful designs for inspiration on Pinterest.


If you take a look at the photo to the left, you'll notice a lot has changed from my original designs to how the website turned out. Well, that's because when you're both the developer and the designer, I've found it's really easy to get caught up in making changes on the fly. So in this instance, using Git, I used code as a sort of living, breathing Figma. And you'll see some similarities from the original version I started building out from, but I do hope in the future to really work my way through that process a bit more thorougly.
I got caught up in the combination of developing and designing to rapidly produce this portfolio not just because it was a lot of fun, but because I really wanted to be able to have something to showcase to start applying to real product design jobs. I'm ready to move on from engineering.
My learning is far from over, but I think I'm in some capacity ready. I'm working to complete Google's UX Design Certification, and that's coming along smoothly (I'll update this to it being done when I'm finished). The good news is I've consistently been excited about this process, and am always eager to learn more. It is nontheless a process, that's why I've chosen the images to my "Works In Progress" that will eventually fill the "Work" section of portfolio. They're there to remind me when I see the unfilled boxes of progress, that progress happens day by day. And all progress is progress all the same.
Below is a simple sample of a mock project I did wireframe out, create a user-workflow for, and create a high-fidelity prototype. If you made it this far - I hope to hear from you soon.
Explore the interactive prototype below. Click through to see the design in action.
Interactive Figma prototype - click to navigate

