IDSE103 - Assignment #3
Interface Development
Part 1: Scanned high quality sketches of four screens in your app. Revisit your app features and functions and craft them into a cohesive toolkit for a single user.
Part 2: Using the Apple UI Design Resources, create high fidelity mockups of those four screens in Sketch or Adobe Experience Design
Part 3: Prototype your "calculator" screen in HTML, CSS, and Javascript so that it functions.
(Start from the provided template.)
Constraints
- All interfaces should be sketched, mocked, and designed for iPhone X
- Sketches should be based on those done in class, but should be reworked at a higher attention to detail (alignment, spacing, line weight)
- High fidelity mockups should be pixel-perfect, production quality and submitted as PNG files at least 600px wide.
- HTML prototype should also be high-quality and include 3 inputs and an output
Inspiration and Examples
Tools
Tutorials and Reference
Other Logistics
- All sketches should be scanned at high resolution, no less than 300 DPI
- Retain all raw media files in original, high-resolution formats for later revisions
- Submit work as a GitHub pull request, see the detailed submission instructions
Grading
Criteria
|
Points Possible
|
Assignment submitted on-time and presented with care
|
10
|
Sketches show attention to detail
|
15
|
Mockups are pixel-perfect and respects iOS design standards
|
25
|
HTML prototype renders nicely
|
25
|
HTML prototype functions correctly
|
25
|
Student Work