Design for Mortgage Page

Steve Sticky Note This is where the user first views the calculator. They must first enter their basic mortgage information before anything is available on the right. Steve Sticky Note 2 & 3 are currently inactive until calculate payment button clicked and the numbers satisfy requirements. Titles Faded. Buttons greyed out in this stage. Steve Sticky Note All functions Download | Email | Print are unavailable until information has been entered. lisa Sticky Note Apply Prepayments | Amortization schedule can be opened by clicking the arrow but no information will be displayed. just a message to enter your mortgage information. lisa Sticky Note Main Mortgage Calculator page will default like this. User can instantly enter their information. lisa Sticky Note Help: question mark can appear anywhere in the site where confusion may occur. When clicked it should have an overlay appear describing the section it resides in. In this circumstance it would have helpful info about the payment information section lisa Sticky Note Clicking brings you to broker contact info page. lisa Sticky Note Clicking brings you to main solutions page. lisa Sticky Note Information has been entered. This gives payment details and allows user to click buttons in section 3 lisa Sticky Note This button will open the apply prepayments section (Page 3) *Rollover should cause button to change to dark blue lisa Sticky Note This button will open the amortization schedule. (Page 4) *Rollover should cause button to change to dark blue lisa Sticky Note These functions now active that information has been entered. Download icon should download a PDF containing this information. Email should pop up a window above this content prompting for email address Print should print the pdf version. lisa Sticky Note Clicking compare mortgage will take current information entered and populate section 1 of 3 in scenario comparison (page 6). It will also open the scenario comparison tab for the user where they will see the information created here in section 1. *Rollover should cause button to change to dark blue lisa Sticky Note buttons now active lisa Sticky Note opens displaying amortization schedule lisa Sticky Note Section can be opened either by clicking the button in section 3 of payment information or by clicking the arrow to the left of prepayments lisa Sticky Note This dropdown contains all payment periods numbers. * If periods with prepayments already applied could be red it would be great for user. lisa Sticky Note User selects which type of prepayment they would like to add by selecting the radio button beside it. They then proceed to enter the amount or percentage based on their selection. Clicking add will open the amortization schedule. The prepayment should be applied to the period selected *the content should clear in this section once add is selected ** add button is greyed out if you dont have a payment type selected in that section. lisa Sticky Note Section can be opened either by clicking the button in section 3 of payment information or by clicking the arrow to the left of amorization schedule. *clicking the arrow again should close the section lisa Sticky Note clicking arrow beside period would reverse the order of the list lisa Sticky Note Clicking either the prepayment amount (in red) or the edit button should open the apply prepayments section. Populating it with the prepayment period, amount and type. From there you could modify an existing prepayment. Click save and it should change within the schedule. *delete should also be an option. lisa Sticky Note Delete 'X' will clear the prepayment from the users schedule. User should be prompted if they want to delete the prepayment. lisa Sticky Note If you clicked the scenario comparison button after creating a sample in 'payment amount' that amount will appear in scenario 1 lisa Sticky Note Fill out the other scenarios then click "recalculate scenarios" to create your comparison. Results page 7 lisa Sticky Note scenarios are now visible for comparison. You can edit and recalculate as much as you want because the fields stay open. lisa Sticky Note Just like the payment amount section you can print, email or download the content. lisa Sticky Note Clicking yes or edit brings you to and opens the apply prepayments section and amortization schedule. This way the user can look through their schedule for existing special payments or add brand new ones lisa Sticky Note Clicking delete X clears all special payments from scenario. To delete individual ones you have to do it in amortization schedule. lisa Sticky Note Clicking No or '+' will bring you to the apply prepayments section. amortization schedule should also open. 1-Calculator 2-Calculator 3-Calculator 4-Calculator 5-Calculator