Website St. Augustine A Technical Viewpoint Deja Vu anyone?

Slides:

Advertisements

Similar presentations

Web Page Training Summer 2014 Presented by: Mountain Brook Schools Tech Team.

Advertisements

PRIORITIZING WEB USABILITY. Introduction  How the Book Study Was Conducted  Tested 69 users ages Broad range of job backgrounds and web experience.

UI Best Practices Application Developer’s Intro School Week 1 Day 1.

LO4 - Be able to create websites

New Semantic Elements (Part 2)

National Center for Accessible Transportation Proposed Guidelines for Web Accessibility in the Travel Industry R.J. Zaworski, and K.M. Hunter-Zaworski,

Web Design Graphical User Interface Navigation. Website Prototyping Plan your website Take time to plan the goal And outcome for your site Based on target.

Refinement Production Implementation Design and Development Stages.

User experience designer, User Interface Designer (UI), Information architect, Portal / Intranet development SharePoint WORK SAMPLES Highly confidential.

User Centered Web Site Engineering Part 2. Iterative Process of User-Centered Web Engineering Prototype Evaluate Discovery Maintenance Implementation.

Usability Information Systems 337 Prof. Harry Plantinga.

Conceptual Design of the Website Site Architecture andNavigation.

Web Design Guidelines By ZhengHui Hu. Planning User Analysis  Goal  Target Audience Enhance Accessible  Impairment  Environment  Technical Limitation.

User Centered Web Site Engineering Part 2. Developing Site Structure & Content Content View Addressing content Outlining content Creating a content delivery.

Where Do I Start REFERENCE: LEARNING WEB DESIGN (4 TH EDITION) BY ROBBINS 2012 – CHAPTER 1 (PP. 3 – 14)

Business Definition Analysis & Design Phase. Development Team Smit Shah (System Analyst, Web Developer) Harsha Balagere (Web Designer) Abdullah Alsubaiei.

Developing the EdWeb- driven website mobile interface Usability research conducted February 2015 Findings and next steps Neil Allison University Website.

© 2012 Boise State University1 WordPress Training February 14, 2013.

A web design firm! Champyon Shots. The Proposal The purpose of this website is to promote Greenville College Soccer for future recruits. The terms of.

Web Design, 3 rd Edition 4 Planning a Successful Web Site: Part 2.

Orion Project Proposal HTML Tutorial Website. Define.

Web Development Life Cycle from Beginning to End…and BEYOND!

1 Designing Need-based Internet Web Sites in Counseling and Career Services James P. Sampson, Jr. Florida State University Copyright 2002 by James P. Sampson,

 What is a wireframe?  What features are important?  Which wireframe tools might you want to try?

Developing A Website. Reminder 1 You want your website to be _______? 1)Artistic 2)Easy to use 3)Interactive 4)Multimedia-driven.

© 2012 Boise State University1 WordPress Training February 14, 2013.

Websitewala.com Welcome to. The purpose of your website is to develop a valuable set of information sources that provides information and news about your.

Website Accessibility Testing. Why consider accessibility People with disabilities – Visual, Hearing, Physical, Cognitive (learning, reading, attention.

E-commerce usability guide provides guidelines and advice for implementing easy to use e-commerce websites. It focuses on online catalog/selling functionality.

WEB DESIGN SOLUTIONS. 2 Presentation by JAVANET SYSTEMS 1st Floor, ROFRA House, Suite 4, Kansanga, Gaba Road P.O Box 31586, Kampala, Uganda Tel: +256(0) ,

Progress Report: Project 4 Web Solutions. Interviews (Jennifer) Usability Testing (Andrea Kayne) Final Report due Accessibility Analysis (Andrea.

DESIGN ELEMENTS: IDEAS May 25, Template Examples 2 Navigation is organized by topic and by audience. Global navigation is horizontal. “Stories”

Web Redesign Project Update September 15, Agenda Recall: Project Scope and requirements Information Architecture Usability Testing Visual Design.

MI.GOV Site Design Evaluation October MI.GOV Usability Review  MSU Usability and Accessibility Center (UAC)  Reviewed rankings by studies like.

My.umich.edu Partial Integration of Dynamic Services with Visual Design.

Refine Produce Implement Design and Development Stages.

Graphical User Interface (GUI) Web site Team Matix Proposal GC 215: Web Publishing.

Website Design Presentation to Members Of The American Morgan Horse Association By Bill Lere August 22, 2012 Copyright, Bill Lere, 08/22/2012, Minneapolis,

Knikki Crenshaw Hank Henry Nancy Rice Tom Sakell Ben Yzaguirre Knikki Crenshaw Hank Henry Nancy Rice Tom Sakell Ben Yzaguirre.

Rockford College Campus Web site Development. Today’s Agenda Review Best Practices Discussion Review Template 3 design possibilities Discussion Site/Front.

7/8/04 1 Web Project Phase 3 - Sketches Use pencil and paper to sketch the layout of the pages in your web site Considerations – Placement of text? – Placement.

The Changing Campus Web November, December 6, 2015 page 2 Agenda 1)Introductions 2)Overview: Campus Trends 3)Overview: Lessons Learned 4)Our Approach.

Technical Communication A Practical Approach Chapter 14: Web Pages and Writing for the Web William Sanborn Pfeiffer Kaye Adkins.

Content Administration 08/19/13 & 08/20/13.

Kara Pharris Web Designer Site Improvements & the Usability Project Concepts for usable navigation, functionality and presentation.

?. When designing, you should analyze your target audience. Design you webpage around your target audience Target Audience.

University of Washington Bothell Computing and Software Systems Website Project.

AFACT Website Report Iran Center for ecommerce Development 33 rd plenary meeting

CGC 417 Final Project Presentation Prettydog.com Mini E-Commerce Site Maria A. Moratto Yu Yuan Department of Information & Management Technology.

Copyright © Terry Felke-Morris Learning Outcomes  In this chapter...  common types of website organization  principles of visual design  your target.

WHY DO YOU NEED IT? What is a wireframe?. A wireframe is… A wireframe is a simple visual guide to show you what a Web page would look like. Wireframes.

{ User Centered Design Final Presentation Donia Canaveral }

Pre-Production Meet with the client to create a project plan:

Creating a Flash Web Site

Basics of Website Development

Define phase Interview the client to understand goals, audience, content, design, and delivery requirements. Organize and outline interview information.

Web Design and Development

DESIGN PROJECT PRODUCTION PHASES DEFINE, STRUCTURE, DESIGN, BUILD AND TEST, DELIVERY ® Copyright 2012 Adobe Systems Incorporated. All rights reserved.

Session I Chapter 18 - How to Design a Web Site

Enhancing Student Learning and Retention with Community Partnerships

Practical guide to build Modern Intranet sites with SharePoint Communication Sites Asish Padhy.

Web Development Life Cycle from Beginning to End…and BEYOND!

Objective Understand web-based digital media production methods, software, and hardware. Course Weight : 10%

DESIGN PROJECT PRODUCTION PHASES DEFINE, STRUCTURE, DESIGN, BUILD AND TEST, DELIVERY ® Copyright 2012 Adobe Systems Incorporated. All rights reserved.

HTML5 Level III Responsive Web Design (RWD) and Front-End Frameworks

Workshop 02 How to manage Faculties Websites using CMS

Web Development Life Cycle from Beginning to End…and BEYOND!

Refine Produce Implement

WEB DESIGN Cross 11, Tapovan Enclave Nala pani Road, Dehradun : ,

ITI 133: HTML5 Desktop and Mobile Level I

Presentation transcript:

Website St. Augustine A Technical Viewpoint Deja Vu anyone?

Agenda Approach to design Design Elements Visual Elements Compliance & Accessibility Questions

Introduction / Approach User Centered Approach Identify & meet with target audience e.g. Faculty, Staff, Current / Prospective Students Conduct interviews & tasks What users need What is important to them Frequent / Infrequent tasks How they accomplish tasks now How they should accomplish (mental notes) Develop Prototypes "Throughout the entire development process and beyond, users play a critical role in the design of easy-to-use products. After all, who knows more about which products are easy to use than the people who use them?" IBM User-Centered Design website

Outline / Work Flow { Develop Prototype* } PrototypeExisting Websites Final Design Conduct Usability Tests *Prototype design based on best practices / researching other similar websites as well as utilizing information gained from first phase of usability tests

Example outcome of aforementioned processes Wire frames to begin template designs Group of templates to be used for Faculties / Departments Header with crest and top navigation Footer MENUMENU Spotlight Image ABCDEFG Announcements & Job Opportunities News Header with crest and top navigation Footer MENUMENU Spotlight Image ABCDEFG Announcements & Job Opportunities News Events Calendar Sample Wire Frames For Faculty Homepages A-G represent image links to department homepage

Agenda >> Next Approach to design Design Elements Visual Elements Compliance & Accessibility Questions

Standard Elements of Design Web page objects and positioning Header with UWI Crest & text Campus Navigation & Search Footer with contact info, disclaimer, privacy, flags Menus - Left Hand Side or Top About Contact Program Details Research Initiatives Staff Information Student Information Linkages

Optional Elements for Content Pre built modules can be used to support content on the Faculty or Department Home Pages: News Modules Calendar Modules Announcement Modules Job Vacancy Module Other custom handles not catered for already or in the pipeline e.g. eCommerce Cart, Blogs

Agenda >> Next Approach to design Design Elements Visual Elements Compliance & Accessibility Questions

Visual Elements Graphics & Spotlights standardize on the techniques used to design website spotlights. This should be aided by a Marketing / Design Specialist. Use of Visual Buttons appropriate university related imagery with clear and readable text Identify standard group of fonts to be used on graphical buttons and images

Agenda >> Next Approach to design Design Elements Visual Elements Compliance & Accessibility Questions

Compliance & Accessibility Use of CSS with compatibility above 1.0 XHTML 1.0 WAI Compliance Use of Interactive Objects / Alternatives Requires 3 rd Party components Works with standard web browsers Flash JAVA AJAX DHTML / Java Script

Agenda >> Next Approach to design Design Elements Visual Elements Compliance & Accessibility Questions

Can one design encompass all faculties / departments? Possibility of different designs with similar layouts for faculties and departments (state a distinction / definition for design and layout) All sites should have a standard set of links / content what should these links be?

Thank You