table of Contents
Preface
When we observe the applications that need to be developed in daily life scenarios, the first step is to do a demand analysis. At present, the basic tool for demand analysis in the industry is still axure. I currently use axure8 and it feels quite easy to use. Prototype is a professional vocabulary. In fact, it is more popular to draw sketches. When I didn't use prototyping tools before, I usually used a pen to draw sketches on paper and communicate with customers. That kind of efficiency is quite low and not easy to modify.
Use of Axure
Go to the official website to download axure, install it, and open the software.
Its layout is the same as many foreign software. The left, middle and right layout. The leftmost is the component area. We can drag the components we need to the middle canvas, and the right is the attribute setting area. There are also ink knives, but as a programmer, I don’t like that. I naturally resist the chargeable things. I charge for everything.
Component library
Axure itself has a basic component library, and it uses the basic original library to create prototypes daily, but wouldn’t it be more efficient to use a component library created by others. So I chose antidesign's original library, have you found that you learn programming by yourself, you will find a lot of benefits, as long as you keep learning, knowledge will surround you.
The download address of the original library: Design Resources.
It has two versions, one is the web version and the other is the mobile version. Because we need to make a prototype of the mobile terminal, just download the mobile version.
How to use it after decompression? The three small bars next to the axure component library can be loaded into the component library.
After importing, we can switch to the corresponding component library to see the completed components.
Home function planning
The first page opened by a small program is the homepage, so what functions do we need to plan for the homepage? We are planning a seafood store this time. What the daily owner often does is to show the way. Then I want to give a carousel picture is a good function. The first picture is the business card in the store. Everyone will know as soon as they enter The address and contact information of the shop owner, and the rest of the carousel pictures, put the daily activity promotion pictures, I basically know what activities you are doing. Then put a nine-square grid to put the store’s categories, and I can intuitively know how many categories you sell. For the third page, the most popular products will be released. The most popular products are recommended to the homepage for customers to buy.
Prototyping
The idea is there, and then I draw a sketch. Open axure and create a new page and rename it to the home page.
Let’s drag the component library we just imported into a background
because the phone has a status bar, drag a status bar, the battery is 100% representing us The motivation for learning is always full of energy.
Then switch to the basic component library and drag a text label. After changing the content to the Crab King online store
, you need to make the share button on the right. If you want to draw, draw a rounded rectangle first, and then draw three Click, and there is the closed icon.
Then drag a picture component, and draw two small circles to represent the switch.
Then it is our Jiugongge. In fact, we have six categories and draw six small squares.
Then it is our hot sale The product is composed of two horizontal lines and text. For
the layout of the product, we have a two-column layout. It is composed of product images, product names, prices, and sales. The
mini program cannot be a single page, so we put the navigation bar of the page to the bottom
Preview the effect after drawing the prototype
Remember to save it at any time, because these softwares don't know when they will crash, so you won't save it.