More about this site...
Here is some information and frequently asked questions about this site,like why it was created, who it's designed for, and why certain design choices were made.
Who is the target audience?
The website's target audience are those that are interested in learning more about the projects various NWTC students have created. The design for the site supports this audience as it encourages users to look more into the different types of programs these students come from, with the option to learn more about each one on the home page, and it offers a page to view projects from previous digital arts showcases in places like the archive.
What is the message?
In my opinion, the website's specific message is to look at each art piece within the perspective of the program it came from. For example, how did the photographer utilize the environment around them to take said photo, or how did a web developer utilize JavaScript, CSS, and HTML to make a website respond to certain actions and look a certain way? Each program utilizes the tools they know differently to create their own pieces of art, and this site serves like a gateway into these different avenues by going into detail about each program, etc.
There isn't much visual design that conveys this message, but there are small elements that contribute to each program's uniqueness, like the different SVG's present on the homepage, to each program having their own page.
What is the goal?
Again, the goal of the site is to allow users to explore the various types of artwork created by the four programs showcased at the Digital Arts Showcase at NWTC. Another goal is to inform interested users into attending the event. The design promotes both of these goals by allowing a place for the user to learn more about each program, and make a contact request about the event. A map provided by Google Maps is also integrated into the site, so the user can place in their address to get directions to the event.
What CTAs (Calls to action) exist?
There are several calls to action that exist on the site to engage users with the site. Simple ones include various shortcut links to the program pages that have little icons and change when hovered over. More notable ones include the Contact page having several fields for the user to fill out in order to receive information, or submit a form.
The design enhances these calls to actions, as something changes or occurs when a field has been filled out correctly, a link is hovered, or the form is valid to submit. These little changes serve as indicators to the user of what to do next when something is triggered, ie. click the link that changed colors, submit the form since the submit button turned green, etc.
Why this design?
The design and color pallette chosen for the website are my favorite to use, that being a 12 column grid layout, and the pastel like colors with a dark gray undertone.
The 12 column grid layout makes it easy to insert any content anywhere, and has enough breakpoints to allow for the unique placing of said content, like an 'aside' piece, various form fields, etc.
The colors chosen are a personal favorite, as I really like the pastel colors contrasting with the dark gray, giving a serious, but playful tone to the site. In addition, the elements that do have color are mainly the ones that allow the user to interact with them, and are some of the most important pieces of the site, such as the navigation bar, footer links, and form labels.
The typography choice was a recommendation from class, to have two total fonts, one for headers, the other for paragraph text. I wanted to choose a modern and smooth font for the majority of words, seemingly allowing them to be easier to read, then a thicker text for the headings to make them stand out.