Salesforce Trailblazer Credentials

Sam St Michael

Sam St MichaelSam St MichaelSam St Michael
  • Home
  • Projects
    • Brands & Visual Design
    • UI Interactive Prototype
    • Wireframes / Prod Design
    • Design 4 Good!
    • Dashboard / SAAS / App
    • E-Commerce
    • Web Redesign / SEO
    • Case Study/Presentations
    • Managing Social Media
    • Salesforce Portfolio
  • My Process
  • Contact Me
  • More
    • Home
    • Projects
      • Brands & Visual Design
      • UI Interactive Prototype
      • Wireframes / Prod Design
      • Design 4 Good!
      • Dashboard / SAAS / App
      • E-Commerce
      • Web Redesign / SEO
      • Case Study/Presentations
      • Managing Social Media
      • Salesforce Portfolio
    • My Process
    • Contact Me

Sam St Michael

Sam St MichaelSam St MichaelSam St Michael
  • Home
  • Projects
    • Brands & Visual Design
    • UI Interactive Prototype
    • Wireframes / Prod Design
    • Design 4 Good!
    • Dashboard / SAAS / App
    • E-Commerce
    • Web Redesign / SEO
    • Case Study/Presentations
    • Managing Social Media
    • Salesforce Portfolio
  • My Process
  • Contact Me

FIGMA INTERACTIVE PROTOTYPE - MOBILE iOS

Above - Working Figma Prototype

Ongoing Project

Shown is the working prototype: Used Smart Animation and Micro Animation in some areas.  
I have (2) Home Page designs.  


Please send me an email and tell me which Home Page you like better! 

Email Your Vote!

Process of this project

Persona & Business

Persona & Business

Persona & Business

Design a mobile app using 'Random Project Generator.'

Scenario; Come up with a business name and persona.  Sketch an E-commerce store.

Wireframe of Flow

Persona & Business

Persona & Business

Task;  Create wireframes for the Home Page, Product Features, Checkout, and Confirmation Pages.

Mood Board

Persona & Business

Mood Board

Shown is my mood board for persona: Felipe, a 70-year-old man, married with no children.

Is a small business owner with a doctoral degree.  He lives in Anacortes and is familiar with my product, and is constantly commuting/traveling.

What I learned

Designing a Mobile App - Prototype using Micro Animations & Auto Layout in Figma

I have wanted to improve my skills on micro animations and use them to design a mobile app.  I enjoy learning and adding more skills to my toolbox.  While searching for newer material, I found a short course on one of my favorite sites, Udemy.


This is my first time using the 'Random Project Generator site.  What an excellent new tool!  I learned how to manipulate simple text to create a custom logo, and I'm pleased with the results. 


To view more of this project and the wireframes, Click the button below or check out the working Prototype above.

See Wireframes

Figma Interactive Vacation Desktop Prototype

Ongoing Project

Shown is a prototype I designed using micro animations and responsive design with auto layout and constraints.   **A work in progress**

PLEASE CONTACT ME IF YOU DO NOT HAVE ACCESS TO PROTOTYPES.

Access Issues?

Process of this project

#

Sketches

How the prototype reacts to hover, scroll & exit.

#

Grids & Wireframes

#

Wireframe Overlay

Figma UI, showing Overlay transfer after Loading.

What I learned

Designing a Desktop Prototype using Micro Animations & Auto Layout in Figma

I found a few fantastic YouTube videos on auto layout and constraints.  I am searching for newer material, showing the latest updates and 'How To Do' on Figma.  


 Lottiefilies is a fantastic resource to pull in "loading" animation, and I just fell in love with it!  I learned how to do micro animations on an overlay.  So happy that I didn't have to build that from a blank canvas.  


This is an ongoing project.

Prototyping in figma

This is a screen shot showing how the desktop prototype will flow to all the interactive triggers and actions.  


I also incorporated smart animation.

interactive Prototype - using Marvel

FacebookInstagramLinkedInPinterestTwitterYouTube
FacebookInstagramLinkedInPinterestTwitterYouTube
FacebookInstagramLinkedInPinterestTwitterYouTube
FacebookInstagramLinkedInPinterestTwitterYouTube
FacebookInstagramLinkedInPinterestTwitterYouTube
FacebookInstagramLinkedInPinterestTwitterYouTube

Copyright © 2000 - 2023 Sam St Michael UX PORTFOLIO- All Rights Reserved.

Powered by GoDaddy Website Builder

This website uses cookies.

We use cookies to analyze website traffic and optimize your website experience. By accepting our use of cookies, your data will be aggregated with all other user data.

Accept