← Home

UX/UI Design

Product Design & Mobile Prototypes

The various courses provided by the TAM program have taught me versatile skill sets that I’ve leveraged in order to beef up my tool box of creative abilities. In these courses I learned various design fundamentals and technical skills which have enhanced not only my work but also the way I view the world. Therefore, my creative skills have been deeply developed, helping me create a wide range of projects. A specific type of creative work that I particularly enjoy is UX/UI Design—a perfect combination of strategy and creativity. UX/UI Design is incredibly important and should be used in concert when designing a product or service.

A design isn’t just what it looks and feels like, it’s also the experience of using a particular product or service. The best way to think about user experience is in combination with UI. UI stands for user interface. Simply put, user interface makes up the visual and physical elements that a person interacts with when using a device. UX stands for user experience—the emotions a person feels during an experience that he or she has while interacting with a user interface. Those emotions of an experience can be feelings ranging from happiness to frustration and everything in between. Even your coffee maker has a UI; so what conventions are out there in the world that you should take advantage of so that your user doesn’t think too much about brewing a fresh pot of coffee? Ensuring that the experience of a product’s UI is intuitive and encourages positive emotions is the ultimate goal; however, I like to think of user experience as the time it takes to get frustrated when navigating a user interface. To encourage the positive emotions and mitigate the negative, I leverage the combination of various skill sets, creative direction, and user knowledge in order to best design a successful product.

I took a course called Product Design that satisfied the remaining three credits/requirements of my TAM minor. In this course, I learned all about UX/UI Design and the necessary procedures that take a creative idea for a product or service and bring that vision to life. The phases pertaining to user experience are essential to execute before moving forward with actually designing the visual/aesthetic components of a product—performing the necessary research and much-needed preparation in order to determine whether your idea will succeed or not.

Furthermore, these phases of gathering research and preparing a product’s user interface are important in regard to the emotions of the user; it is the goal of designing a product or service to encourage certain emotions that a user will feel while interacting with a user interface (i.e., the visual and physical elements). Once you have planned out an adequate user experience, designing the product comes next—time to build a visually pleasing interface for your users!

This phase is a research-heavy step in which much information is gathered in order to determine whether your vision will survive or not. Each idea for a business or product applies to a certain market, and it’s necessary to know if an idea will survive in its pertinent competitive market.

• Problem Statement:

  • Intention

  • Premise

  • Solution

  • User-Motivating Features/Factors

• Findings (pain points) aka Pains & Gains:

  • Market Research

  • Consumer Interest

  • Dependencies

  • Risks

  • Competition

  • Inspiration

• Distribution Strategy

• Pains & Gains

Once the Discovery phase is complete, it’s time to start mapping out how users will use your product and discover the emotions that they will experience while using its user interface. By properly planning a user’s journey before starting any of the design work, the actual design process of constructing your product’s user interface will be much more successful. It’s important to consider your users’ emotions, how your users will come across your product, where your design efforts are most likely to be effective, and how to make your product as intuitive as possible. Considering the following aspects of efficiently framing a user experience are particularly important:

• Questionnaire

• Persona of Ideal User/Consumer

• User Journey

The remaining tasks below can be accomplished once the above phases have been carried out. If your research suggests that your idea will be a competitive contender through the Discovery phase, and if you have accordingly outlined a user interface through the Framing phase, then it’s time to move forward with these final steps; now we can plan out your product or service and start the design process of your creative idea. Let’s build that user interface!

• Sitemaps & Wireframes

  • I’ve used Adobe XD to build wireframes before, but I also enjoy simple pen and paper to plan out the structure of a website or app—some things just don’t get old.

• Design Tools, Web Technology & Social Accounts

• Deploy Online

• KPIs

  • Definition of Success

  • Tracking Success

  • Evolution of Success

UI Design

Many of my experiences have provided me with skills in regard to both graphic and web design—the necessary skills for user-interface design. Here’s an example of UI Design that I made for a prototype of an app using Illustrator and InVision!

I combined my Spanish and 'Technology, Arts & Media' backgrounds to create a prototype for a Spanish project. I designed each artboard in Adobe Illustrator with the dimensions of an iPhone 6/7/8; once the creative side of the project was complete, I exported all artboards as PNGs and uploaded them to InVision. I then began to create hotspots on each PNG, yielding a mobile-application user interface that compares New York City and Barcelona.

The goal of this project was to compare and contrast two international cities. The Discovery phase of better defining user experience wasn’t conducted as the app was simply intended to be informative in order to fulfill the project’s requirements; I was never going to actually code the app and deploy the finished product online. However, aspects of properly framing the user interface of this prototype was carried out so that its interface was intuitive and easy to use.

The above steps that I learned through this course and other skill sets I have cultivated over the years have been handy for client projects. I used this product-design process for Halo Esthetics, a client of mine, to gather information regarding the user experience of their service, design an intuitive, visually pleasing user interface for their website, and define a powerful brand essence for their business as a whole.

If you would like to see examples of the above design process I delivered to Halo Esthetics, feel free to reach out! Learn more about the other services I provided for Halo Esthetics and how some of them relate to UX/UI Design.

prev / next