I worked at Safe Software Inc. as a Web Developer for the FME Server product. There I worked within an agile team to discuss and implement planned features and working to meet product goals. I created wireframes and mockups for both new features and refining existing interface, then implementing them within HTML, Sass, and hybrid Angular/AngularJS framework.

Automations has been a long running project that started before my time at Safe Software. As the project grew closer towards release, I worked closely with stakeholders to refine the boilerplate interface, building enhancement features, and tweaking user flows.

An example is designing how users navigate to their automation workflows and manage or edit them. I approached these widely scoped projects first by researching how users would approach this task in the context of the product, then building mockups and share them to my supervisor/stakeholders. Then after further refinement and research, I implement my ideas to our project.

Some enhancements from this process sprouted the ideas of image previews for quick visibility of existing workflows, and a “quick-start” overlay that points to the user tips on how to use the tool, as well as a page where users can quickly see their last workflows. These enhancement was aimed to giving new users some guidance when first starting up the new tool, as well as a place where users can quickly access different components of the tool, or dive straight into building their workflows. I also refined the user flow for managing existing workflows to be familiar to existing similar features throughout the product while having different features be readily accessible.

As our team worked on Automations, it’s interface needed more polish as the project came closer to release. Using the same research and design process I did for the user flows on accessing Automations, I improved upon the interface in steps. The old navigation, and toolbar access made it feel outdated and clunky to use. I condensed information and updated the look of the buttons to feel less compressed and easy to use on all screen sizes.

The core aspect that went through several iterations were the “nodes” of the tool. These nodes were the core component for conveying information to our users on building out their workflows. I was tasked to design and implement and improved the node’s visual aesthetics, and interactions. By researching competitors, our own existing diagraming tools, and conducting user research to internal users, FME Server Automations nodes were completed with usability, aesthetics, and condensing information in check.

Working on the Automations project, I mainly focused on usability as we rolled out new features for the tool. Much like how I designed my other ideas, each individual decision on building out features I was tasked for, I try to weave in enhancements to make using Automations easier and friendlier to use. Other user experience changes I worked on were cleaning up the “smart-linking” of Automation nodes as a neat minor feature that helps users building their workflows.

I also collaborated with a back-end developer to store settings specific to the user’s preferences on the interface, and persist those settings on different browsers. My goal for these decisions are hopefully only to further improve the FME Server product.

Working within this project and at Safe Software has given me plenty of insight in working within front-end development. I refined my ideas through our feature demos once they are completed, or asking opinions through our internal experts who use these tools and help clients using FME Server’s tools, or even asking other developers who are associated with FME Server for their opinions, all have helped me become a better designer and developer. I was also able to experience working on an agile environment, as well as the experience of working with product owners, QA’s and other developers all working on building a wonderful product.