Create wireframes to show a scenario where the user views location, books for two categories, completes payment and receive confirmation.
WIREFRAME 1 - LANDING PAGE - ABOUT EVENT: The header area of the page in the wireframe remains constant with the event logo, date, time and location as these are valuable information for the user to decide if he is free to participate or not instead of reading it in small letter hidden in a page filled with other information. In between a task if the user has forgotten the date it is easy to view it in this format. The main information has been kept simple and divided into two pages. About the event page has all the important information along with the location map. This page helps people check their calendar to make sure they are free to attend the event.
WIREFRAME 2 - EVENTS REGISTRATION PAGE : Once the user is done viewing the event details, he/she moves onto the events registration page.
• All the events appear at one go, parallel to each other to help the user view options at the same time.
• Selection and adding participants happen in the same page. This avoids the user moving between pages to view different information or enter each information in multiple steps.
• Mouse over on the image will give details of the category.
• As and when the participants are added the order summary gets updated, so they are aware of the amount to be paid rather than it being a surprise at the end.
• Steps until payment are shown to help the user understand at which step he/she is at. Theres are not in separate pages to make the process quick.
WIREFRAME 3 - VIEW MAP: This shows the google location map. This will help user with the location details and decide if it works for them or not.
WIREFRAME 4 - SIGN IN PAGE : The user needs to sign in at this point with his email id to move ahead in the process. There are three options. If the user doesn't sign in he/she can select quick check out. Sign in page is at the second step of registrations to help viewers go through details and if they do not take part they will not have to sign in. If the user has participated in previous events he may already have an account.
WIREFRAME 5 - PARTICIPANT DETAILS : As per the events and participants selected in the previous page, the number of participant forms appear.
• The email address directly sends each of these participant a confirmation mail once payment is done. If left blank they will not receive the mail.
• Information can be edited or participant can be deleted at this stage.
• Post signing in it welcomes the user and shows previous booking if there are any.
WIREFRAME 6 - PARTICIPANT DETAILS : The first participant details are completed when all the mandatory fields are filled and it moves to the next participant details.
• The order summary appear till payment is done so the user is aware of the amount to be paid if he has exceeded his limit he can add or remove participants.
WIREFRAME 7 - PARTICIPANTS DETAILS: Once the required details are filled for all the participants, summary of the details appear and the next button gets activated to move forward.
WIREFRAME 8 - PAYMENT: The user choses the payment method, enters the card details and makes the payment for the selected participants.
WIREFRAME 9 - CONFIRMATION WINDOW: This appears with payment and registration confirmation so the user is not anxious and is aware the process is completed.
