San Mateo County

07/2017 - 09/2018

Technical Scope

AngularJSHTML5CSS3BootstrapJavascriptjQueryUnderscoreASPPHPDreamweaverPhotoshopIllustratorInDesignGoogle AnalyticsWordPressAccessible Page Development

Summary

Responsible for web and printed material requests from all divisions of San Mateo Assessor-County Clerk-Recorder & Elections. Primary requests were from Elections division included official site redesign and providing solutions for issues of migration, provided maintenance and optimization of old official site before new site went live, internal site design and development, sample ballot pamphlets creation, election ads related material design, election worker pins design.

Internal site- 

Due to the old internal site was using ASP, to maintain the internal site became really difficult. The file structure was messy. Dead links, missing images and out dated information caused the reduction of site usage. The department supervisor suggested to redesign the internal site and expected to increase the usage of the internal site.

Challenge-

• The old internal site covered so much information. If I wanted to have one page design, I needed to find a better solution for categorization.
• Because the office was governmental department, there was no access to database. It would be a huge problem to creating a content management system (CMS).
• To increase the usage of the internal site, I needed to design some easy-to-use tools for employees to create dependency.
• The color theme should be energetic.

Solution-

• I used orange as the primary color and blue to be the complementary color to make the page more energetic. I also use Helvetica Neue as the main font type to be sure of the legibility of pages.
• I used PHP and Json to solve the problem of access to databases. For security concern, I also made some change on the Apache Configuration.
• I followed employees' working habits and designed some convenient gadgets such as calendars, time-salary converters, and calculators.
• I created quick link panels to make all information covered in the one page design.

 

SMCACRE- View Site

The old official site was using VBScript so it was hard to maintain. Each department couldn't update pages by themselves. They always relied on web admin to update pages. Furthermore, the file structure was messy and no responsive design. Therefore, the department head suggested to out source to resign the official site with content management system using Drupal.

Challenge-

• There were two old official sites so how to merge two sites into one and efficient categorization became the main problem.
• Some of old apps such as voting System and voter registration system were using VBScript and couldn't be replaced. Moreover, the new site was hosting at the third party's server. How to implement old apps to Drupal site without cross origin issue became another issue.
• How to increase click through rate, reduce bounce rate, and collaborate with out source vendors also our concern.

Solution-

• To solve old apps implementation issues, I used iframe and Javascript to solve the responsiveness and cross origin issues.
• We invited each department heads to efficiently categorize information and got reviews from different department members after the draft site finished.

 

Election Worker Pin- 

This is the design of election worker pins for June 5, 2018 Statewide Direct Primary Election

Challenge-

• Because of Statewide Direct Primary Election, The graphic on the pin should be associated to California and distinguished from previous election pin design.
• The design should be related to election and gorgeous

Solution-

• I used U.S. flag and history museum graphic to be associated to San Mateo County, California.
• To be gorgeous look and feel, I decided to show more gold texture. I also use the combination of blue, red, and white to give the feel of election.

 

Key Achievement

• Participated in designing and developing the new official site, www.smcacre.org, using HTML, CSS, JavaScript, and jQuery, Bootstrap, Photoshop, Illustrator, Dreamweaver.
• Designed and developed new CMS intranet without database access using AngularJS framework and PHP for admins to create, edit, delete information and images. Employees can easily find what they want by keyword search and search filters.
• Maintained and optimized old official site using HTML, CSS, JavaScript, jQuery, ASP, VBScript before swapping to the new site.
• Designed and developed web forms and pages for 2017 November and 2018 June Elections, such as Accessible Vote by Mail System implementation, accessible web forms development for screen readers, courier web form development, Press Release update. Also in charge of election pins, Sample Ballot Pamphlets, and other materials.
• Scheduled monthly and weekly report using Google Analytics.
• Selected for Election Night Results Posting for June 5, 2018 Statewide Direct Primary Election.