Shopping UX where pressing the "price" turns into "buy-confirm" then "checkout"

I'm trying to optimize the in app purchase for my users who only want to buy, and checkout as quickly as possible.

Current situation

My store offers other things for sale, but when a user only wants on thing, I'd like to streamline this flow:

  1. User finds item
  2. User clicks on item to item details
  3. User clicks on shopping cart (usually in the hard-to-reach upper right hand corner)
  4. User clicks checkout.
  5. User uses Apple pay to purchase

This requires more finger-acrobatics than I want

Proposed situation

How should I design a row of "something to buy" where I streamline this?

Is it a good idea to compact those actions into a single row? Where....

  • Each product (row) has a price, and the price can be clicked on.
  • Clicking outside of the price hotspot will show product details
  • Clicking on the price will replace the price with "buy now"; clicking again will offer to "check out"

Perhaps I could animate this with the entire row shifting left to expose the convertible "buy now" and "check out" button.

Additional thoughts

What are your thoughts on this UI/UX implementation?

Is there a better way to go about it?

Does this work for all mobile users?

Tags: