William Clasen » Portfolio

Web Development Portfolio...

The University of Milwaukee Bachelor of Science in Information Science and Technology immerses students in organization and dissemination of information in digital format.

The program emphasizes human and technological factors relative to information architecture, information organization, storage and retrieval; and applications of the Internet. Courses taken outside the digital information curriculum included advanced Visual Basic, advanced web design, and internet marketing.

Brief descriptions and links to sample projects can be seen below. Proficiencies relative to software and coding can be found under the education tab.

 

Clasen Web Development | Click to open web page in new tab.

Ongoing client-based re-design

The existing site was intended for self-promotion of a civil engineering consulting firm. It is assumed that future expansion of the site will include such client management solutions (CMS) as project related data dissemination, instant messaging,and account management.

Internet marketing analysis revealed Arc Design Resources to be a B2B type of operation. B2B sales are more relationship-based and the sales cycle can be fairly long. B2B companies focus on creating sites that will capture their audience, present information that makes the company seem established and capable, and encourage users to take further action by contacting a company representative.

The site incorporates Flash, PHP, JavaScript, XHTML, and CSS designed to promote the B2B strategy.

Preliminary usability analysis and development strategy can be viewed in PDF format here. As of August 19, 2011, the existing site lacked considerable functionality. A screen capture of the layout targeted for redesign can be seen here.

 

Clasen Web Development | Click to open web page in new tab.

Client-based New Site Development

This site is an attempt to establish a web presence for a small local business where none existed. The Client, Dr. William Grzelak, DDS, wanted a straight-forward, one-page layout as part of a marketing campaign.

Aside from simple XHTML and CSS, a few advanced coding techniques were employed. The site utilizes two jQuery sliders [one for images and one for internal navigation]. The site also incorporates a PHP mail form with Captcha. The site map is a JavaScript link to the Google Maps API.

Perhaps half the work on this site will be given to Search Engine Optimization (SEO) in an online marketing effort. Aside from incorporating various SEO tactics into the meta data and the structure of the document, various other tactics were to be employed during the months following publication of the site. Google Analytics and Webmaster Tools, as well as Open Site Explorer were to be monitored. Most of the time devoted to SEO would be in the realm of link-building.

You may view the proposal in PDF format here.

 

Clasen Flash Development | Click to view this site.

Flash Resume

The Flash alternative of this resume incorporates advanced design theory and actionscripting.

Though the content is nearly identical, users indicate that it has a different feel.Redundancy in navigation and AS3 control of the timeline provide for more dynamic interaction.

You may click here to view the Flash version of this site.

 

 

 

Clasen Software Development | Click to download this application.

Visual Basic with SQL

Object oriented programming and SQL were the foci of this self-motivated project. Dataset object hierarchy and standard three-tier design were explored in detail. The result was a multi-tier, multi-form UI to access a relational database with multiple tables.

The project entails a GUI as well as database access for storing, sorting, and analyzing quiz results. The analytics make it possible to tailor subsequent quizzes in order to provide extra practice with certain problems that a child may be having.

The interface is themed. The multi-media elements including audio and animation were introduced beyond the scope of the project.

Feel free to download the zipped application here. After unzipping the downloaded file, be sure that the database and the executable Math Facts file reside in the same directory. You may create shortcuts to the executable file on networked PC's. That way, multiple copies of the database are not required.

 

Clasen Usability Analysis | Click to download report in PDF format.

Sample Usability Test Report of Mobile Interface

This usability test and analysis follows the Common Industry Form for Usability Test Reports v2.0. As the test lead and preparer of the report, I formulated and implemented the Excecutive Summary, Product Summary, Test Objectives, Methodologies, Profiles, Procedures, Usability Metrics, Data Analysis, and Recommendations. You may download the report in its entirety here.

From the executive summary: Many services readily utilized by seniors are migrating online. Marketing analysts have identified three common goals with respect to users of smart phones over fifty-years of age: text messaging, email, and web connectivity. A usability test was conducted targeting the iPhone 3G ver.4.1 on the AT&T cellular network for use by elderly clientele. This document contains test methodology, efficiency / effectiveness ratings, task completion rates, time on task, errors, participant feedback, and discussion for improvements based on applicable theory.

 

Clasen HTML5 and jQuery | Click to view this site in a new tab.

Client-based re-design featuring HTML5 and jQuery

This site was designed to complement the parent company site for Total Plumbing and Heating. Information hiearchy invites users to drill down through niche market descriptions for more information. Various other elements reflect common B2B objectives relative to the corporation's trade. The relative importance of these elements is indicated by placement, repetition, and contrast.

The subsidiary, Total Excavating, also required a logo design to complement the parent company logo. The vector graphics were used in the design to provide scalability in duplication.

This site employs the latest HTML5, CSS3, and jQuery coding techniques while not losing site of backwards compatibility. Although some refinements may be lost in older browsers, multiple style sheets and scripts are called upon user browser discovery. You may view the page here.

 

Clasen Web Design | Click to open web page in new tab.

Graphic Design and Flash Development

This page was designed for a highschool marching band fundraising event called, "Music and Fire".

Adobe Illustrator and Photoshop were used to develop custom graphics throughout the site. Branding and page composition were the foci of this unique project.

You may view the page on any flash enabled device here.

 

Clasen PHP Scripting | Click to view this project in a new tab.

PHP Project

This small site is intended to be a companion to the William Clasen Resume. It is an extension of the IST Portfolio to illustrate my current experience with PHP and MySQL. My studies relative to PHP and MySQL targeted the following objectives and competencies: Fundamental understanding of the web server environment | Authoring PHP documents | Utilization of various functions in PHP for user-friendly web sites | Utilization of SQL through PHP application on the web | Implementation of useful and usable web sites with the full power of PHP | Implementation of database on the web via PHP/MySQL | Integration of PHP with other web features such as forms, JavaScript, and XML.

Feel free to explore the site. Although registration is required via email, the SHA function was not called for encryption. As such, certain security loop-holes are apparent in this application. It is intended to illustrate academic php form and function.

 

Clasen Web Design | Click to open web page in new tab.

Dreamweaver Spry Object Development

This personal page was a lesson in Dreamweaver layout and design.

HTML, CSS3, JavaScript, and jQuery were customized in conjunction with Spry Objects to create a simple interactive slide show. Consideration was given slide transitions and the size of the JPEG images used by the slide show. The two pages associated with this site focus on cross-browser support and optimized load times.

In consideration of the advanced CSS3 features that were incorporated, browser detection and recommendations are offered to the user. You may view the page here.

 

Clasen Javascript | Click to open web page in new tab.

Javascript

Cross-browser / platform support became the focus of this assignment. Aside from incorporating a Javascript slideshow and a Googlemap interface, the page identifies the user's browsers and loads audio relative to the user's browser. The slideshow is accessed by clicking the thumbnails. The audio can be paused utilizing the control in the footer of the page. The page was tested in all major mondern browsers.

The assigned webpage met the following requirements: Create a webpage for your hometown. You will insert a Google Map of your hometown using the coordinates of your hometown as the center point of the map. Travel Math can be used to search for your town's latitude and longitude coordinates. The assignment will meet the following requirements: Externally reference CSS and Javascript files. Manipulate the Googlemap API to provide information about your hometown. Control the layout of the page with CSS

 

       View William Clasen profile on LinkedIn      Download printable PDF of William Clasen resume      © 2017 Clasen