For our Project Week: One, we created a front-end prototype for a new app branding marketing site. We were given a comp for full desktop view, and created a fully-functional prototype following mobile-first approach, tailored for handheld mobile device, tablet, and desktop RWD views.
Besides semantically correct HTML, we focused heavily on Sass architecture. We built smaller components, then built up surrounding pieces from there. As a four person team, we made a plan based on defining component pieces, then delegated responsibilities among the group. When we ran into overlap issues, we resolved them cooperatively. Along the way, we tested on mobile (Safari and Chrome), tablet (Safari), and desktop (Safari, Chrome, and Firefox).
See the the comps/
directory. Choose the one that you want to execute on and DO IT!
There are three individual deliverables:
- Mobile/tablet/desktop HTML/CSS/JS prototype
- Style-guide view that illustrates the primary typography, color palette, and core UI elements of the view
- A view or series of views that illustrate the individual major components of the design isolated from the total view, this view should also illustrate responsiveness
- A clean Git project; .gitignore, clean commitment history and quality comments
- Semantically correct HTML
- No CSS, all Sass all day long
- Completed/working version of the comp
- Links to style guide view and component library
- Working carousel
- Update top nav and link to each section of the view / smooth scrolling a +
- jQuery plug-ins are optional, but limited to one per project
- Deployed to http://surge.sh/