Vicky Green. University of Arkansas

Transcription

1 Educational Report of ETEC 5373 Web Design 1 Vicky Green University of Arkansas An Educational Report of Personal Development and Knowledge Gains of a Hands-on Experience from a Web Design Course Taught at the University of Arkansas Fall 2013

2 Educational Report of ETEC 5373 Web Design 2 Abstract Web site development can be a difficult task for an inexperienced designer. Often, designers focus on aesthetics of the site and not usability, which can hinder navigational tools and ultimately cause confusion among users. As a visual learner, I often missed the point of instruction when it came to usability of a website. Dr. Ken Muessig s ETEC Web Design course provided a hands-on learning experience by utilizing web tools and applications that encourage online collaboration to clarify the missed instruction. I experienced face-to-face instruction that aided my visual needs by chatting with Dr. Muessig through remote access, which was a crucial tool in learning how- to build a website. Through remote access and Elluminate sessions (a video / audio instructional tool), my learner development was scaffold to evaluate the needs and usability of a website.

3 Educational Report of ETEC 5373 Web Design 3 Project Description The Burnsystem website is an example of knowledge gained while enrolled in ETEC 5373 Web Design online course. The site was designed to host information for future collaboration between the university community, the United Keetoowah Band (UKB) and the city of Tahlequah regarding a native wellness proposal. The proposal will unite a community of Cherokee Indians through preventive medicine and cultural. A requirement of the grant was to ensure the plan was nationwide in three years. Building a website with proper collaboration tools, grant requirements and instruction for fulfilling the requirements was a crucial tool in networking tribes and communities nationwide. Johnson & Johnson and the Society of Arts offer a four-year $25,000 grant for an organization that promotes wellness in a high cultural environment. The specifics of the grant proposal is located at future of the website will be determined if our proposal is granted. If we receive the grant, the website will become functional for user logins, donations, and provide instruction for grant requirements. The Tahlequah Chamber of Commerce will provide demographics and calendar of events for the Native Wellness proposal. Northeastern State University (NSU) will provide public relation connections and outsourcing of resources. The UKB will provide a history of cultural events, and manage the implementation of the proposal (specifics of the collaboration plan; see artifact 3). I created the website with consistent templates to increases usability. Nielsen and Loranger 2006, reports website with consistent templates reduce navigational confusion within the site. The content box was designed to hold large text in a horizontal template to minimize scrolling for the Read more option. This option allows committee members to edit Microsoft Word documents. In addition, the website meets ADA compliances (Section 508) including; large text, navigation buttons, and detailed image descriptions (alt texts) for visual or hearing-impaired learners.

4 Educational Report of ETEC 5373 Web Design 4 Project Identification The Burnsystem website addressed five (4) of the 21 ETEC national sub standards. The weekly course modules of ETEC 5373 provided development, utilization, management and evaluation opportunities upon completion of tasks. The sub standard 3.2 Demonstrate the ability to develop a web-based project for dissemination of media-based learning the course allowed me to demonstrate this skill, and provided a platform to collect information for the grant proposal. An overall goal in the class was to create a website that utilized instructional tools (PPT, Word, social media, etc) to create a presentation to the learner s chosen organization or institution (depicted in the first course module assignment). I chose to continue my work on the grant proposal by creating the Burnsystem website, therefore my chosen organizations were NSU, UKB and the city of Tahlequah. As part of the final project, I had to integrate multiple forms of media into my instructional materials, which is sub standard 2.2 of the ETEC development standard. I created website templates in Microsoft Word and PowerPoint, created pod-casts and narratives on social media tools (blogs) to prepare for the final presentation. The preparation steps created a deeper understand of creating visual materials to enhance the learning process of the grant proposal. The bulk of my learning experience in this class helped me to accomplish the utilization standard and sub standards of the ETEC program. In addition to developing multiple forms of media, I had to implement and utilize the media to teach the steps of acquiring the grant, as well as each user s responsibility if the grant was obtained. I used collaboration networks (Togethr.com) as a platform for users to communicate questions or concerns regarding the proposal. Implementing collaboration tools and multiple media formats within the website allowed my users to create information for the final presentation (submitting the site to J&J and the Society of Arts). Without the implementation of these tools, my users could not communicate and transferring information would be up to the web designer not the organization. Sub standard 3.3 Develop and implement effective polices related to the utilization, application, and integration of media-based learning in a specific organizational context. As mentioned earlier the website is ADA compliance (14pt fonts, site map, and detailed alt tags). Dr. Muessig s course heavily influenced Section

5 Educational Report of ETEC 5373 Web Design compliance. Weekly assignments of research and demonstrations of tools used in ADA compliance scaffold the creation of usable websites not aesthetically pleasing sites. There are two websites within my portfolio, each website has alt tags, large font and highly contrasted backgrounds to highlight important information. Considering the demographics (limited technology equipment and use) that would be using the Burnsystem website, it was important to implement the compliance polices within the site to ensure users could easily print and review the site. This brings me to sub standard 5.1 Demonstrate ability to use both formative and summative strategies to evaluate the quality of instruction. In addition to developing and utilizing information gained in this course, the final project required formative and summative evaluations of the website. Learners were instructed to create documents for peer-to-peer evaluation (formative). The weekly modules of the course required learners to provide feedback of submitted templates, and to evaluate the learner s overall usability of their website. The feedback provided by my peers was a valuable tool in the re-design of the website templates; after all, if my peers did not provide effective feedback, then chances are my users would not be able to navigate the site. (To see examples of Burnsystem transformation, click the design tab under artifact 2). In addition to the formative feedback from my peers, I also created surveys and performed user testing of the Burnsystem site. User testing of the site identified concerns regarding responsibility and overall requirements of the proposal. The UKB users seemed lost with the specifics of their tasks and objectives regarding the proposal. NSU students and the public relations office understood their tasks and objectives, but preferred to contact the UKB with questions and concerns. The flow of information traveling back and forth was a difficult process and created uncertainty between both user groups. The UKB did not want to commit until NSU committed and vice versa. In addition, both user groups did not want to set up a meeting due to lack of time and the disorganized content of the proposal. The Tahlequah Chamber of Commerce had no real issues with the website and was interested in the proposal, but as time passed, I found the proposal in a pile of paper work to go over at chamber meetings. Given the confusion, lack of record of interactions and lack of time available, we found

6 Educational Report of ETEC 5373 Web Design 6 designing a website with editable documents and a network for interaction would allow users to leisurely review documents and keep records of communications to explain the proposal process. The results indicated user needed specific instruction and an easier navigational tool throughout the site. The evaluations led the creation of editable documents and collaboration tool in the site. Educational Reflection Upon graduating at NSU, I was required to take a web design course (to me it was more of a computers in technology class) that suggested the utilization of Photoshop in building websites with minimal use of HTML code. The result of the course was a basic resume page built by the learner to demonstrate knowledge gained of HTML code (excluding CSS). I was afraid I would fail the course; because I could not grasp the concepts of how to build a website with HTML code, I sought additional support. I sat next a website designer who walked me through the process as he coded the page for my final project. My contribution to the project was solely placing images and directing a narrative. I was so confident I would never use this information again, I asked the UofA to accept my web design course from NSU, for I feared seeking additional support. Thankfully, my request was denied, and I enrolled in Dr. Ken Musseig s web design course. Dr. Ken Muessig s ETEC 5373 course created a hands-on learning experience. With his guidance, I developed cognitive schemes of how-to perform specific tasks for future website design (see additional website designs under article 2). I consider myself a novice website designer. I create images in Photoshop and hyperlink information. I spent a lot of time building items in Photoshop then placing them into a template because I could not understand concepts like margin and padding in a basic box model design. In addition, I was not creating a HTML template, I was writing HTML code for each page. During a remote access chat with Dr. Muessig, I was able to see the error of my ways as he navigated me through the steps to create a HTML template with margins and padding (the Burnsystem website was built). A couple years later, an old professor from NSU remembered my excitement of learning how to build websites, asked for my help with creating

7 Educational Report of ETEC 5373 Web Design 7 websites for his advertisement firm ( I know hard to believe).anxious to show off, I built three custom websites centered around navigation and usability. However, our clients did not prefer a custom website; they are paying for service providers like Yellow Pages, & AT&T solutions that offer pre-existing templates that reduces the overall cost of establishing a website. There is a problem with pre-existing templates; often the host provider does not allow clients to alter navigational buttons or the structure of the box model (providers only allow color changes to templates). With the NSU and UofA class, I was able to utilize knowledge gained from both classes and create websites our clients can maintain and alter when needed. In addition, through the side job(s), I am able to continue my education in website design. The hands-on learning environment created by Dr. Muessig I was able to overcome my fear of failing by learning Dreamweaver and usability concepts. Even though I consider myself a novice designer, I continue to learn website usability by researching applications and domains to enhance knowledge gained from the ETEC 5373 course. Thinking back upon my initial response of of never using this information again, I wonder how much of my education I gave-up to obtain a degree. In all honesty, I thought I would pay someone to do this work; this is not my field of expertise. The problem is those experts want thousands of dollars to build a custom website. I am collaborating with the advertisement firm to evaluate the need and usability of a website(s) for two clients. The first client has the funding to pay a designer to build the site, however the client is not sold on the idea of a professional site for his business (which would cost $20,000). For the past months, I have been utilizing the knowledge gained in Dr. Muessig s course to provide usability and compliance information so our customers can decide which marketing plan works for them. The second client does not have the funding but desires the same quality of work for her site. I sit once a week trying to explain the importance of usability not aesthetics needs not personal interests to my clients. It s an uphill battle, but we are getting there. In fact, I bought an extra copy of Nielsen and Loranger s Usability book (textbook used in the course) in hopes my clients will read it and obtain the knowledge I gained.