Challenge Overview
Challenge Overview
You are provided with a native xCode (iphone/iPad) solution, and a new UI design (storyboard). You are reskinning the existing application to match the new design in this challenge.
Challenge Requirements
-
Provided in the challenge forums is a pdf document detailing the existing application flow (Solar Site Design - Existing App Design.pdf).
-
Make sure to read the pdf, it contains all information to understand how existing app works. We are only reskinning here so the functionality will remain the same.
-
We will outline below the mapping between the existing screens and new screens by referencing to the PDF file.
-
-
We are updating the iPhone and iPad screens in this challenge
-
Here is an overview about the screens in scope :
-
App icon
-
Provided a new logo, you will use “Logo In Circle” icons.
-
-
Splash screen
-
we don’t have new design screen for this, so you will use the same login screen with only the logo being rendered in the middle/center of the screen.
-
-
Login
-
Screenshots :
-
01.Login
-
01.Login-pass-reset-corect.jpg
-
01.Login-pass-reset-failed.jpg
-
01.Login-pass-reset-success.jpg
-
01.Login-pass-reset-empty.jpg
-
-
It corresponds to screens in page (13) in the pdf
-
Reset password screens are new ones, you will implement them without logic in this challenge.
-
-
Register
-
Screenshots :
-
02.Registration
-
-
It corresponds to screens in page (14, 15) in the pdf
-
-
Dashboard (Navigation)
-
Screenshots :
-
04.Navigation
-
-
It corresponds to screen in page (19).
-
We are replacing the dashbaord in existing design with a hidden menu.
-
The user can tap on menu icon to toggle menu. Or can Drag right/left to expand/close the menu.
-
-
Site Surveys Listing
-
Screenshots :
-
03.Home-no-site-surveys
-
03.Home
-
-
It corresponds to “My Reports” screen in page (53) in the pdf.
-
“All” tab will list all surveys.
-
“Drafts” tab in new design corresponds to “Incomplete” tab in existing design.
-
“Submitted” tab in new design corresponds to “Report History” tab in existing design.
-
“New Site Survey” button corresponds to “New Site” tab in existing design.
-
Tabbing on the button will start “New Site Survey” flow.
-
-
Tabbing in an entry in the listing will take user to survey details screen (14.Survey-details.jpg)
-
-
Error styling in this screen should follow same error styling in the New Site Survey screen.
-
-
New Site Survey
-
It corresponds to screens displayed in pages (21 - 36) in the pdf.
-
Screenshots :
-
05.Step-1-project-data
-
Corresponds to screen in page 22 in the pdf.
-
-
06.Step-2-installation-data
-
Corresponds to screen in page 29 in the pdf.
-
-
07.Step-3-design-information
-
Corresponds to screen in page 33 in the pdf.
-
-
08.Step-4-flat-roof-design-copy
-
08.Step-4-ground-mount-design
-
08.Step-4-pitch-&-flat-roof-design
-
08.Step-4-upload_videos_photos
-
08.Step-4-pitch-roof-design
-
The above 4 screenshots correspond to the screens in page 36 in the pdf.
-
Note that if there is more than one structure type selected then the screenshot (08.Step-4-pitch-&-flat-roof-design) will be used to list all structure types selected. Meaning it will be stacked in top of each other in a single screen.
-
-
08.Step-4-pitch-roof-design-confirmation-modal
-
This model is displayed when successfully submitting a survey.
-
-
08.Step-4-pitch-roof-design-modal-draft-success
-
08.Step-4-pitch-roof-design-modal-draft-Fail
-
08.Step-4-pitch-roof-design-modal-draft
-
The above two screenshots are displayed when user click on ‘save as draft’ button in header.
-
-
08.Step-4-pitch-roof-design-upload-modal
-
This modal styling will be displayed for any option in the app that asks user to upload image/video or select them from library.
-
It corresponds to screens in pages (23, 24, 25 and 26) in the pdf.
-
On successful upload a thumbnails will be displayed
(08.Step-4-upload_videos_photos)
-
-
-
-
Survey Details screen
-
Screenshots :
-
14.Survey-details.jpg
-
-
This is new screen, it will display a readonly survey information.
-
-
Quick Referral
-
Screenshots :
-
09.Quick-referral
-
09.Quick-referral-sign-modal
-
09.Quick-referral-confirmation-modal
-
-
These correspond to ‘QuickViewInspection(_iphone).xib’ in existing application.
-
It will follow same design elements and styling as other screens, including the error styling.
-
-
Calendar Survey
-
Screenshots :
-
10.Survey-calendar-changed-day
-
10.Survey-calendar-current-day
-
-
It corresponds to screen in page (50) in the pdf.
-
The dots in some dates mean there are scheduled date or visited sites scheduled under that date.
-
Orange highlight cell represents a selected date.
-
By default, the current day cell should be highlighted.
-
Current day cell borders will be highlighted with orange color.
-
Tabbing on a scheduled/visited sites will take user to Survey details page.
-
Note in the new design the Year is missing, you need to add it along with Month.
-
-
Map Survey
-
Screenshots :
-
11.Map-survey
-
-
It corresponds to screen in page (55) in the pdf.
-
Tabbing on a marker will take user to survey details page.
-
You must update the logic to integrate with Google Maps.
-
-
Contact
-
Screenshots :
-
12.Contact
-
-
It corresponds to screen in page (57) in the pdf.
-
Tabbing on Email support will open default email app with recipient populated.
-
Tabbing on call support will start a phone call.
-
-
Settings
-
Screenshots :
-
13.Settings
-
-
The new design combines both “SolarChangePassword_iPad.xib” and “SolarUserProfile_iPad.xib” (same for iphone) screens in existing app.
-
-
-
Only portrait orientation is required.
-
The application should be fully functional with the backend after reskinning.
Supported OS and Devices
Your solution should upgrade the existing application to support the following :
-
iOS 7+
-
iPhone 5, iPhone 5s, iPhone 6, and iPhone 6 plus.
-
iPad retina, iPad air, and iPad mini.
-
xCode 6
Documents
Provided in challenge forums :
-
Existing iPhone xCode solution
-
Screens requirements document : Screens-Requirement.docx
- Storyboard design and Screenshots
Final Submission Guidelines
Submission Deliverable
-
Source Code
- Detailed Deployment Guide