MILESTONE inside the design process
COMPANY BRANDING. MILESTONE
A significant event in a personâ€™s life, often marking the start of a new chapter.
Great websites start with great brands, so our group project began with researching the function of travel agencies.
We developed a basic site map and a list of features that we wanted on each page. Although our ideas changed throughout the project, this gave us a solid place to start and begin our design research!
As in any design project, we took time to explore visual styles and design resources. Our team particularly liked the feel of flat web design, which we felt could be successfully integrated with the powerful photography that travel oriented marketing lends itself to. Some of our favorite sites for inspiration during this process were Pinterest, Behance, & Dribble.
WIREFRAME MOCKUP. Using Adobe Illustrator, we spent over a week constructing and refining a mockup of our website in order to get a true vision for our company. After deciding to go with the modern, trendy feel of flat web design, we decided on some other key visual elements to be repeated throughout our site, as depicted below.
Blue Color Palette
CALL TO ACTION
Flat Vector Illustrations (& Rounded Boxes)
HTML & CSS
With our wireframe as a guide, we went into the coding process knowing exactly what we wanted, making the HTML & CSS phase of the project much easier.
This was the most time-consuming part of the website development â€” we put a lot of effort into integrating functioning jQuery scripts and then styling them to fit our brand.
After scouring the web for marketable travel content & destinations, we researched key features and starting prices for each travel package, and found appealing, high quality photographs.
One size does not fit all â€” the last step in our coding process was to use media queries to make sure our website will adapt to all screen sizes, including mobile devices, and not to mention all modern browsers.
Use & Development:
QUICK VIEW POP-UP
5 STAR RATING SYSTEM
Use & Development:
MEDIA ELEMENTS. We chose to use two different styles of graphic media elements on our website:
INDIVIDUAL ROLES. LINDSAY KLENZMAN Worked On: User Interface (UI) Co-Design, User Experience (UX) Design, Focus Group Polling, Price Research, Destination Research
TANISHA THOMAS Worked On: Cross-Browser Debugging, jQuery Plugin Testing, Photography Compilation, Destination Research, User Interface (UI) Co-Design
SARAH RIEDLINGER Worked On: HTML/CSS Coding, jQuery Plugin Implementation, User Interface (UI) Co-Design, Vector Artwork Design