Graphic Design & Web Development

The Graphic Design & Web Development Program is designed to prepare students for the real world of computer based graphic design and web development. This program starts with basic computer skills, digital media design fundamentals, illustration, and basic photography, then works all the way to advanced concepts in front end web programming. The end result of program completion creates a well-rounded graduate that will have the skills necessary to get an entry-level career in the fields of graphic design and web development. At F.I.R.S.T. Institute, we strive to keep our curriculum updated to reflect actual trends in an ever-growing and fast-paced industry.

Students learn a basic level understanding of computers, their parts, and terminology for the first week of Graphic Design Principles. After students have learned the fundamentals of computing and have a good understanding of the different types of digital media formats, F.I.R.S.T. introduces them to deeper subjects. Students will learn art history and the evolution of visual arts in relation to the development of modern design principles and standards as a foundation to contemporary visual design and color theory. Classes get introduced to the Adobe Creative Suite of products as they are widely used throughout most of the classes in the graphic design and digital art courses. Important skill sets are then developed through studies on creative thinking and concept development, business communications, client briefing and analysis, digital printing, and the importance of print production processes. Students learn the fundamentals of Typography and then examine Marketing in relation to corporate and personal branding and social media.

With an intense focus on illustration, students are introduced to Adobe Illustrator, an industry standard used primarily in the creation of vector graphics and line art. Students first learn about the concept of illustration through the study of simple, sequential, and editorial illustration. The Adobe Illustrator user interface, workspace, and tools are then learned through demonstration and exercise. As skills are gained, students go from creating simple vector shapes to more advanced vector illustrations and graphics, including the use of typography. Students will take the skills learned in Illustrator to complete several projects that include creative illustrations and a branding strategy for small and large businesses.

In this course of study, students are introduced to digital photography and camera basics. They will set up cameras along with lighting considerations and learn to use them in real photo shoots. Assets obtained from these photoshoots will be used in their Photoshop course of study. After this initial portion of the course, they are introduced to the art of layout using the elements and principles of design. Next, students take some time to apply and further grow their layout and design techniques while learning Adobe InDesign. Using InDesign, students will create several projects such as a catalog and brochure and then go on to develop a print campaign for their course project.


Projects completed in GDWD 103:

• Photoshoot Project
• Indesign Layout project

Adobe Photoshop is an industry standard for graphics editing, creation, and photo manipulation. From the technical processing of multiple images to the making of unique artwork and digital paintings, Photoshop is used by animators, graphic designers, web designers, photographers, architects, and more. Throughout this course, students are introduced to the many tools and feaures of this powerful raster graphic editing software. Photographs from GDWD 103 (Digital Photography) are some of the images used to learn key skills in photo selections and editing. Building on skills learned, more advanced features, effects, and techniques are taught using demonstration and hands-on exercises. Students use their full understanding of tools to create several portfolio worthy graphics projects throughout the course.


Projects completed in GDWD 104:

• Product Photo Retouching
• Headshot Retouching
• Photo Collage
• Digital Ad
• Web Banner
• Poster

Students are first introduced to the concept of Career Development, what it means, and its monumental purpose in helping them find a job in their field of study. They will focus on the design of their own personal portfolio which will include a cover letter, resume, business card, and self marketing social media outlets like SoundCloud, Behance, and Vimeo. This week is deeply focused on helping students get the skills necessary to obtain an internship. The week is wrapped up by covering interviewing skills with an instructor-led mock interview session.


Projects completed in CD 101:

• Resume and Cover Letter (1st Draft)
• Bio
• Social Media
• Mock Interview

Students are introduced to a brief history of the web, the language, and the vocabulary associated with it. Important design considerations for websites and applications to make them practical for all users is also covered. During this course, students learn how to facilitate easy end-user experiences through meaningful and purposeful front end user interface design. Skills are gained through practical exercise in the layout and positioning of web content and elements. This is done through design research, wireframes, mock-ups, and prototyping. In addition to this, students learn the basic syntax of front end coding languages. Several projects applying design skills learned are completed.


Projects completed in GDWD 105:

• UX/UI Design project

After having developed strong skills in layout and design, typography, illustration, and photo editing, students are taught the techniques needed for putting design assets and graphics into motion. Motion theory is introduced at the beginning of the course in order to give students a sound foundation in the concepts needed to successfully execute on projects. Students will learn technical skills that follow the principles of animation through key-framing, image positioning, masking, and other visual effects. Projects are developed with the goal of helping students grow in their creative problem solving skills to be utilized in the execution of various motion graphics projects.


Projects completed in GDWD 106:

• Scene Compositing
• 2D Objects in 3D Space
• Motion Tracking

The internet through daily interaction, is an integrated way of life for both individuals and businesses. Students are introduced to HTML as a markup language, the foundation for structure building in web-related sites. As language is often broken down to basic words or elements, so too are coding-related languages. Students then learn about HTML elements as the fundamentals of the language and the dynamic results that are produced through its use. A look at the importance and necessity of inclusion for all to have equal participation in the use of the web through accessibility is covered.Students are introduced to CSS, the language used for taking the basic structure of HTML and how it applies to the visual display and presentation of web pages. At this point, students are introduced to Javascript and learn about how it is used to make websites more interactive and engaging to the end user. After having grasped the basics of the language, students learn the basics of jQuery, a Javascript library. The motto for jQuery is “write less do more” because it is said to make coding simpler, as it performs common tasks with less code.


Projects completed in GDWD 107:

• Handcoded Website w/ HTML, CSS, & jQuery

Content management systems such as WordPress are integral to a large percentage of existing sites on the web. These systems make the creation and management of digital content easier for both consumers and designers alike. Time in WordPress is spent on how to modify existing templates and using the advanced features included in them as well. Code such as HTML and CSS learned from the previous courses is used to access those advanced features. An introduction to MYSQL basics and its use in website data storage for content management systems is addressed as well. Afterwards they are introduced to the basics of PHP and how it can generate dynamic page data content.


Projects completed in GDWD 108:

• Personal WordPress Site
• Business WordPress Site

The second week of Career Development will center in on what it takes to be an entrepreneur and get students ready to begin applying for jobs. Students will learn how to update the job portfolios created in the first week of Career Development, with a fine-tuned focus on entry-level employment in their career field. This week will also go over proper networking skills and creating an elevator pitch. Students finish off the week by making sure all of their requirements are met for graduation.


Projects completed in CD 201:

• Resume and Cover Letter (2nd Draft)
• Career Planning Session

In the Web and Graphics Portfolio course, students cumulatively refine and perfect all of their previous projects to a finished and finalized form. This is accomplished in part through professional review and critique. The body of work from GDWD 101 all the way to GDWD 108 is what is included during this last stage of the course. Students leave the program with a diverse and strong, but most of all, professional-level portfolio showing their abilities in graphic design, motion, and front end web design & development.


Projects completed in GDWD 109:

• Graphic Design
• Web Development projects

Graphic Design & Web Development

Download Our Design Career Guide