Web Designer

Total Page:16

File Type:pdf, Size:1020Kb

Web Designer Web Designer OVERVIEW OF THE ROLE The Student IT Office (SITO) provides students with a unique work experience, where students are able to obtain experience and knowledge in web design, software development, project management, requirements analysis, business management and marketing. Students who coop with SITO experience the full end to end lifecycle of project management and software development processes (conceptualization, design, development, deployment) while working on SITO’s flagship product Tiger Center. SITO encourages work ownership and allows students to learn while making business decisions. SITO requires a Web Designer to translate user requirements into an effective design, layout, and navigation for each project. This includes work on new projects, enhancements of existing student managed projects, and support for existing websites and applications previously developed by the Student IT Office, as well as create graphics for SITO such as flyers. The web designer will work in teams with a web developer and a business analyst to achieve project success. MAJOR RESPONSIBILITIES • Understand target audience and needed functionality • Assess design approaches to meet requirements and determine most appropriate option per request • Design and implement digital content (wireframes, mockups, prototype, and production front-end code) • Create or update design documents such as style guides, usability test plans, and test analysis/recommendations • Estimate work effort and document work plans • Work with customer, adapting to feedback and critiques appropriately • Develop, test, and implement projects according to established ITS standards • Work with appropriate areas of ITS to create support and ongoing maintenance plans • Facilitate and/or participate in recurring meetings with customers and team members • The creation and maintenance of SITO flyers, posters, logos, and other visualizations • Additional duties and responsibilities as assigned REQUIRED KNOWLEDGE AND SKILLS • Experience with or working knowledge of any of the following: HTML/XHTML, CSS, JavaScript, jQuery, AJAX, responsive mobile website design and development, Bootstrap • Experience with typography, color, and layout • Experience with Adobe Creative Suite (mainly Illustrator, Photoshop) • Experience/knowledge of UI/UX design • Experience or working knowledge of the software development lifecycle. • The ability to work collaboratively with a team of students from different disciplines and professional staff to complete project work and form the foundation of a student IT group. • Knowledge of principles and processes for providing customer service. This includes customer needs assessment, meeting quality standards, and evaluating of customer satisfaction. • Using logic and reason to identify the strengths and weaknesses of alternative solutions or approaches to problems. • Demonstrate the ability to plan and manage time to meet deadlines and multiple project goals. • Demonstrate good verbal and written communication skills, including relaying information and responding appropriately, efficiently, and effectively with team members and customers. • Willingness to receive feedback and critique from team members. • Be adaptable and able to learn new techniques PREFERRED KNOWLEDGE • Adobe InDesign • Angular JS 4 • Gulp/Gradle • Basic Knowledge of Java, JSP • Usability experience • Accessibility design experience • Native mobile applications • Software development and documentation UPDATED 9/2017 .
Recommended publications
  • Understanding the Impulsiveness Effect of a Web Design on Online Fashion Stores*
    Proceedings of the 2016 International Conference on Industrial Engineering and Operations Management Kuala Lumpur, Malaysia, March 8-10, 2016 Understanding the Impulsiveness Effect of a Web Design on Online Fashion Stores* Paulina Kus Ariningsih, Marihot Nainggolan, Ignatius Sandy, Dhea Widyasti Departement of Industrial Engineering Universitas Katolik Parahyangan Bandung, Indonesia [email protected], [email protected], [email protected], [email protected] Abstract—E-commerce had been a window of consumer-retailer and business-to-business relationship. It had changed supply chain design in last four decades. A Website display, as one of strategic decision of an e-commerce, has been a competitive advantage to win the market. Moreover, impulsive buying had recognized as cognitive natural flaw which had given an advantage for both retailer and consumer. Sometimes, the tremendous increment of the number of internet access on an e-commerce site is not accompanied by increment of buying. Meanwhile, the study about the influences of a web display to impulse buying behaviors had been written so little. In this paper, a preliminary research about the influences of a web display to impulse buying behaviors is conducted. The study is conducted on online fashion stores in Indonesia. This paper depicts the development of sixteen display attributes for accessing impulse buying on online fashion stores. Twenty (20) attributes has been developed from literature survey and interview. Then, a survey has been given to 150 respondents to determine the display’s attributes that influenced to impulsive buying. A factor analysis has been run to sixteen (16) attributes that have significant influence to Impulse Buying and four factors have been developed.
    [Show full text]
  • Gender and Web Design Software
    Gender and web design software Gabor HORVATH Gloria MOSS Rod GUNN Eszter VASS Glamorgan Business School University of Glamorgan Pontypridd, Wales CF37 1DL, UK ABSTRACT been extensively studied [17] but a relatively unexplored field concerns itself with the non-interpretive elements of navigation, There are several studies dealing with the differences between content, form and colours. sites originated by men and women. However, these references are mainly related to the “output”, the final web site. In our Web-design research we examined the input side of web designing. We Summarizing the work on web-design aesthetics, a recent study thoroughly analysed a number of randomly selected web refers to the relative ‘paucity of research’ [12], with ‘no designer softwares to see, whether and to what extent the principles of good www design ... set in stone’ [9] The fact that templates they offer determine the final look of an individual’s some web design is perceived as less than optimum is website. We have found that most of them are typical masculine demonstrated by the fact that the 10 factors with the greatest templates, which makes it difficult to any women to design a deficit amongst Internet users in the US and Netherlands feminine looking website. It can be one of the reasons of the included a factor relating to graphics [20]. masculine website hegemony on the web. The design of websites can most easily be affected by IT Key words: Internet, gender differences, web aesthetics, web professionals. This is a profession in which participation rates design, websites for women, across the board, have fluctuated during the 1990s somewhere between 19% and 22% [15].
    [Show full text]
  • Responsive Web Design.Docx
    Theresa Agostinelli, Librarian, Instructional & Educational Services Monroe Township Public Library, theresacahill@hotmail What is Responsive Web Design? Responsive web sites adapt gracefully to different screen sizes. For example, a site may display in three columns on a laptop or desktop computer, in two columns on a tablet, and in one column on a smartphone. This is illustrated in the above image. It is using the same content, but displaying it differently depending on the width of the screen. Instead of creating a desktop version of a site, and then a mobile version, one site is used for all devices. Web designers used to design for laptop and desktop computers. Now, with users accessing the Internet through laptops, desktop computers, smartphones, tablets, televisions, refrigerators, and more, many web designers have reversed their way of thinking. Instead of designing primarily for laptop and desktop users, and then creating a separate mobile app, many designers are now designing first for mobile users. Mobile first designs should be simpler than traditional layouts, since loading times can vary across devices. Designers may want to limit their use of images and enhance their designs through the use of white space, typography, and cascading style sheets (CSS.) Advantages of Responsive Web Design Responsive websites create a consistent user experience across various devices. Webmasters can make changes one time and those changes will carry over to all of their users. If the site is using a separate mobile app, changes must be made to the full website, as well as the mobile site, for users to see those changes.
    [Show full text]
  • Responsive Web Design (RWD) Best Practices Guide
    Responsive Web Design (RWD) Best Practices Guide Version: 2013.11.20 This document includes best practices around responsive web design (RWD) when developing hybrid applications. Details on each checklist item are discussed later in the document. Checklist RWD Practitioner ❏ Use CSS3 media queries rather than JavaScript onorientation change � ❏ Use flexible font units � ❏ Define a fluid grid system for layout � ❏ Use Flexible Margins and Padding � ❏ Make Images Responsive Where possible � ❏ Use CSS3 Media Queries � ❏ Accept limitations of CSS3 Media Queries � ❏ Consider using CSS Flexbox Layout � ❏ Design for Orientation Changes � ❏ Start and stay with simple layout � ❏ Define key horizontal (and vertical) breakpoints you need to support � Common RWD Problems Copyright © 2013 International Business Machines. All rights reserved. ❏ Avoid onorientationchange events to trigger DOM manipulation � ❏ Manage complex web components with different size-based structures � ❏ Managing graphically drawn components which require recalculation/redraw � ❏ Repaint/flicker due to use of Dojo’s portrait and landscape classes in CSS � Copyright © 2013 International Business Machines. All rights reserved. Discussion RWD Practitioner This section contains technical information for implementing responsive design relevant to practitioners such as CSS experts and web developers. Many of the topics discussed in this documents are also covered in and/or related topics in the following documents and should be used in parallel. ● CSS Best Practices ● JavaScript Best Practices ● Images Best Practices Use CSS Media Queries rather than JavaScript orientationchange events When you rotate a device’s orientation, the browser engine first reflows the content to the new orientation/screen dimensions (using CSS rules). After the reflow occurs, onorientationchange events are emitted to JavaScript.
    [Show full text]
  • Advancements in Web Typography (Webfonts and WOFF)
    Advancements in Web Typography (WebFonts and WOFF) Aaron A. Aliño Graphic Communication Department California Polytechnic State University 2010 Advancements in Web Typography (WebFonts and WOFF) Aaron A. Aliño Graphic Communication Department California Polytechnic State University 2010 Table of Contents Chapter I: Introduction………………………………………………………….…………..2 Chapter II: Literature Review……………………………………………………….………5 Chapter III: Research Methods………………………………………………….…..…....18 Chapter IV: Results………………………………………………………………….……..24 Chapter V: Conclusions……………………………………………………………….…..38 References……………………………………………………………………………...…..41 1 Chapter I: Introduction When it comes to the control one has in designing and creating content for the World Wide Web, typography should be no different. Print designers have had the advantage for a long time over their ability to choose exactly how type is printed, limited only by their imagination and the mechanical limits of setting and printing type. Web designers, on the other hand, have been held back by the inherent hardware and software limitations associated with web design and font selection. What this means is that web designers have not been able to control type exactly the way they want. Web designers have been limited to fonts that can safely be displayed on most computers and web browsers. If web designers wanted to display type with a special font, they had to resort to a workaround that was not always effective. Web designers should have the same absolute control over typography as print designers. Control of web typography has gotten much better compared to the early days of web design, but 2 considering how powerful and robust computers and web browsers are now, it seems unfortunate that control over web typography is so primitive That has changed now.
    [Show full text]
  • Mmc5277 Web Design Principles Summer 2018
    MMC5277 WEB DESIGN PRINCIPLES SUMMER 2018 INSTRUCTOR Efren Vasquez [email protected] 352-875-5088 www.efrenvasquez.com Contact Me Email is the best way to reach me. I try to respond to students within 24 hours, or 48 hours at the latest. If you would like to speak to me on the phone or on Zoom, email me and we can set up an appointment. In case of an emergency, you can text or call me at 352-875-5088. Office Hours I am available Monday-Wednesday-Friday nights from 6-9pm virtually (Zoom or Skype) or by phone appointment. If that time range does not work for you, please email me to coordinate a time. Instructor Bio I graduated in 2014 from Boise State University where I earned a Master’s in Business Administration. After graduating I decided to go back to school and attended the University of Florida Master’s Web Design program. I graduated from this program in August 2017. After graduating I got a job as a teaching assistant and also got a job at a web design company in Ocala, Florida. COURSE WEBSITE & LOGIN Your course is in Canvas (UF e-Learning). Go to http://elearning.ufl.edu/. Click the orange “Log in to e-Learning” button. Login with your GatorLink account. Your course may appear on your Dashboard. If it is not on the dashboard, the course will be in the Courses menu on the left navigation. Click on “All Courses” on this menu. After clicking “All Courses”, you have the option to put the course on your dashboard by clicking on the star to the left of the course’s name.
    [Show full text]
  • Web Design CERTIFICATE
    Program Requirements Guide 2021-2022 Web Design CERTIFICATE Program Overview Program Faculty Program Start Dates This program prepares students for jobs in the Darren Pearson Fall, Spring exciting computer graphics field. Students will [email protected] learn how to take an idea from concept through production including computer graphics and Course Sequence computer animation. Recommended Equipment The following course sequence is recommended; USB Drive, Digital Camera, Adobe Software however, this sequence is not required. Contact The student should be creative and have the Program Faculty with questions. excellent communications skills. Students should Program Requirements exhibit qualities of patience and precision and First Semester should enjoy working both independently and Check off when completed CSCI 1450 Web Fundamentals/HTML .............4 on team projects. DGIM 1448 Adobe Animate 1 ...................2 Course Cr Career Opportunities DGIM 2521 2D Web Animation ..................2 CSCI 1450 Web Fundamentals/HTML .........4 Total Semester Credits ....................... 8 The computer graphics field relates to many jobs in the multimedia area including but not limited to: CSCI 1470 Web Design ....................4 CSCI 2440 Client Side Programming 1 ........4 Second Semester • Web Designer DGIM 1443 Graphical Web Design 1 .........2 CSCI 2440 Client Side Programming 1 • Web Developer DGIM 1448 Adobe Animate 1 ...............2 (spring only) ...............................4 DGIM 2521 2D Web Animation ..............2 DGIM 1443 Graphical Web Design 1 ..............2 Program Outcomes CSCI 1470 Web Design (spring only) ..............4 1. Graduates will design websites using front- Total Program Credits ................ 18 Total Semester Credits ...................... 10 end, web design software packages. 2. Graduates will incorporate industry standard Total Program Credits .................. 18 usability and accessibility practices into web designs.
    [Show full text]
  • Responsive Web Design Techniques
    International Journal of Computer Applications (0975 – 8887) Volume 150 – No.2, September 2016 Responsive Web Design Techniques Waseem I. Bader Abdelaziz I. Hammouri Al-Salt College for Human Sciences, Department of Computer Al-Balqa Applied University, Information Systems, Al-Salt, Jordan Al-Balqa Applied University, Al-Salt, Jordan ABSTRACT internet around the world [3][4], but at the same time it has As new devices and technologies are invented to access the added more work on website designers, because now they internet, from computer desktops, laptops, mobile phones have to deal with many viewing devices and technologies to smart TVs, there has been a great need to upgrade the accessing their work. These devices have different size techniques used in the field of website design, because ranges and capabilities making their work a wonderful these new devices come along with their own specific sizes beauty on one device and a total mess on the other. and views. Although most devices & technologies try to be Nowadays users access the same website from desktop as compatible as possible with the common web design computers, laptops, mobile phones, iPhones, iPads, features, but there has been an absolute need for website Blackberries, notebooks, feed readers and even smart TVs. designers to do a lit bit more to adapt to the fast growing Each platform displays the same page in a different feel race in internet devices and provide all their viewers with from the others depending on its size and viewing the best possible experience while accessing their websites. capabilities. In this paper, different responsive website design techniques are presented that could adapt to different Whenever a user enters a website, the client looks for a technologies and devices while at the same time focusing user-friendly interface, quick access to his/her needs and a on cutting down the time and effort needed for a website comfortable content view without the need to worry about designer or programmer to maintain and edit it.
    [Show full text]
  • The Design Charrette in the Classroom As a Method for Outcomes Based Action Learning in IS Design
    Eagen, Ngwenyama, and Prescod Sat, Nov 4, 5:00 - 5:25, Normandy A The Design Charrette in the Classroom as a Method for Outcomes Based Action Learning in IS Design Ward M. Eagen [email protected] Ojelanki Ngwenyama [email protected] Franklyn Prescod [email protected] Information Technology Management, Ryerson University Toronto, Ontario M5B 2K3, Canada Abstract This paper explores the adaptation of a traditional studio technique in architecture – the De- sign Charrette – to the teaching of New Media design in a large information systems program. The Design Charrette is an intense, collaborative session in which a group of designers drafts a solution to a design problem in a time critical environment. The Design Charrette offers learn- ing opportunities in a very condensed period that are difficult to achieve in the classroom by other means and we have adapted its application from the architecture studio to for New Me- dia instruction. The teaching of information systems has tended to rely heavily on conventional pedagogical approaches although there is growing recognition of the importance of experien- tial and applied learning. Accreditation standards have also placed added emphasis on out- come-based learning and encouraged more mindfulness concerning instructional design (Lee et. al., 1995; McGourty et. al., 1999). As a consequence, more emphasis on experiential learning has emerged in recent years. Architecture has long been used as a reference disci- pline for Information Systems and much of the language used in information systems design is drawn from architectural discourse. However, while architectural design combines attention to history and form as well as function, most information systems design is driven by functional considerations.
    [Show full text]
  • Sample of the Better Web Type Book
    Praise for Better Web Typography for a Better Web Seriously detailed and, more importantly, fodder for any discussion with clients to convince them why the fonts you chose were the right ones for the project. —paul jarvis Designer & author of Company of One Beautiful typography should never be underestimated, it tells a story, it evokes excitement, and seems so simple to create. It isn’t, but it will be once you have studied this must-read edition. —steve jenkins Editor, Web Designer Magazine Matej has written a book about typography that addresses designers and developers equally. But not only has he written an informative book with useful content, it also is written in a very nice and lovely-to-read way. —marc thiele Founder/organiser of beyond tellerrand Co-founder of Smashing Conference Better Web Typography for a Better Web second edition — Matej Latin Copyright © 2019 Matej Latin All rights reserved. The text in this book is set in Tisa Pro and Acumin Pro. Editor: Nick Jones Designer: Matej Latin First released: July 2017 Second edition: January 2019 ISBN: 978-1-9998095-3-9 betterwebtype.com matejlatin.co.uk contents Preface ix 1. Introduction to Web Typography 13 2. Anatomy of a typeface 19 3. Choosing Typefaces 35 4. Equilateral Triangle of a Perfect Paragraph 65 5. Combining Typefaces 85 6. Rhythm in Web Typography 105 7. Modular Scale and Meaningful Typography 129 8. Page Composition 145 9. Responsive Typography 161 10. Ligatures 175 11. Small Caps and Figures 187 12. Punctuation 205 13. Dropcaps 217 Conclusion 225 Appendix A: What’s next? 227 Appendix B: About the Author 229 Notes 231 In typography, paying attention to detail is a fact of life.
    [Show full text]
  • The Principles of Beautiful Web Design by Jason Beaird and James George
    3 sitepoint THE PRINCIPLES OF BEAUTIFUL * WEB DESIGN THIRD EDITION BY JASON BEARD * & JAMES GEORGE V ºr , , º * * * * ~ * 4 y y & * DEEIGNING GHEAT WEE EITES E NOT HOCKET SCIENCE Summary of Contents Preface 1. Layout and Composition 2. Color 3. Texture 4. Typography 5. Imagery The Principles of Beautiful Web Design by Jason Beaird and James George Copyright © 2014 SitePoint Pty. Ltd. Product Manager: Simon Mackie Technical Editor: Giovanni DiFeterici Editor: Paul Fitzpatrick Cover Design: Alex Walker Notice of Rights All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the copyright holder, except in the case of brief quotations embedded in critical articles or reviews. Notice of Liability The author and publisher have made every effort to ensure the accuracy of the information herein. However, the information contained in this book is sold without warranty, either express or implied. Neither the authors and SitePoint Pty Ltd, nor its dealers or distributors, will be held liable for any damages to be caused either directly or indirectly by the instructions contained in this book, or by the software or hardware products described herein. Trademark Notice Rather than indicating every occurrence of a trademarked name as such, this book uses the names only in an editorial fashion and to the benefit of the trademark owner, with no intention of infringement of the trademark. Published by SitePoint Pty Ltd Web: www.sitepoint.com Email: [email protected] About the Authors Jason Beaird is a designer and front­end developer with over ten years of experience working on a wide range of award­winning web projects.
    [Show full text]
  • Responsive Web Design Mendel Rosenblum
    Responsive Web Design Mendel Rosenblum CS142 Lecture Notes - Responsive Web Design Web App Challenges: Screen real estate 1920x1028 640x320 768x1024 320x640 768x1024 Cell Phones Tablets Desktops ● Do we need to build N versions of each web application? CS142 Lecture Notes - Responsive Web Design CS142 Lecture Notes - Responsive Web Design Responsive Web Design ● Content is like water! ○ The web app should flow into and fill whatever device you have. ● Possible with CSS extensions: ○ Add grid layout system with relative (e.g. 50%) rather than absolute (e.g. 50pt) measures ■ Specify element packing into columns and rows ○ Add @media rules based on screen sizes ■ Switch layout based on screen size ○ Made images support relative sizes ■ Autoscale image and videos to fit in screen region img { width: 100%; height: auto; } video { width: 100%; height: auto; } CS142 Lecture Notes - Responsive Web Design Example of Responsive Web Layout Menu #1 - 25% Menu #2 - 25% Menu #3 - 25% Menu #4 - 25% Nav #1 - 25% Nav #2 - 25% View component - 75% Nav #3 - 25% Footer - 100% Menu #1 - 25% Menu #2 - 25% Menu #3 - 25% Menu #4 - 25% Nav #1 - 25% Nav #2 - 25% View component - 75% Nav #3 - 25% CS142 LectureFooter Notes - -100% Responsive Web Design CSS Breakpoints Menu #1 - 100% CSS Rules: Menu #2 - 100% @media only screen and (min-width: 768px) { Menu #3 - 100% /* tablets and desktop layout */ } Menu #4 - 100% @media only screen and (max-width: 767px) { /* phones */ } Nav #1 - 25% @media only screen and (max-width: 767px) NavView #2 component - 25% - 100% and
    [Show full text]