var curPic,curFile,curProj,curDesc,curTasks,curCopy,pClass; // custom object constructor for picRecord object function picRecord(picNum,pName,tName,pWdt,pHgt,tWdt,tHgt,border,meta) { this.picNum = picNum; this.pName = pName; this.tName = tName; this.pWdt = pWdt; this.pHgt = pHgt; this.tWdt = tWdt; this.tHgt = tHgt; this.border = border; this.meta = meta; } function meta(project,desc,tasks,copyright) { this.project = project; this.desc = desc; this.tasks = tasks; this.copyright = copyright; } // Build Pics/Links Array for all pictures and their thumbnails and pages var pics = new Array(); pics[0] = new picRecord("00", "images/prt/g1_00.png", "images/prt/thumbnails/g1_00.png", 750, 551, 75, 55, 1, meta); pics[0].meta = new meta("Chase & Co. Website", "The redesigned home page for the Chase & Co. website. Graphic design was based on ideas provided by the client. The left column content and center picture are dynamic; functionality is controlled by custom JavaScript. See it in action at www.chasecodesign.com.", "Information architecture, graphic design, content editing, XHTML/CSS and JavaScript coding, project management, and ongoing website maintenance.", "Chase & Co."); pics[1] = new picRecord("01", "images/prt/g1_01.jpg", "images/prt/thumbnails/g1_01.png", 840, 480, 75, 43, 0, meta); pics[1].meta = new meta("Chase & Co. Website", "The client provided the basic design concept for the first iteration of their home page (Before). On the right is the final design after we made extensive refinements for presentation on the web (After).", "Information architecture, graphic design, content editing, HTML/CSS and JavaScript coding, project management, and ongoing website maintenance.", "Chase & Co."); pics[2] = new picRecord("02", "images/prt/g1_02.jpg", "images/prt/thumbnails/g1_02.png", 840, 482, 75, 43, 0, meta); pics[2].meta = new meta("Chase & Co. Website", "The client provided the basic design concept (Before). On the right is the final design after we made extensive refinements for presentation on the web (After).", "Information architecture, graphic design, content editing, HTML/CSS and JavaScript coding, project management, and ongoing website maintenance.", "Chase & Co."); pics[3] = new picRecord("03", "images/prt/g1_03.jpg", "images/prt/thumbnails/g1_03.png", 840, 482, 75, 43, 0, meta); pics[3].meta = new meta("Chase & Co. Website", "The client provided the basic design concept (Before). On the right is the final design after we made extensive refinements for presentation on the web (After).", "Information architecture, graphic design, content editing, HTML/CSS and JavaScript coding, project management, and ongoing website maintenance.", "Chase & Co."); pics[4] = new picRecord("04", "images/prt/g1_04.png", "images/prt/thumbnails/g1_04.png", 750, 455, 75, 46, 1, meta); pics[4].meta = new meta("Sierra Gold Website", "The first iteration of the redesigned home page for Sierra Gold. You can see the live site at www.sierragold.com.", "Audience/task analysis, website usability analysis, information architecture, website restructure and redesign, graphic design, Information Mapping and Writing for the Web content reorganization and editing, basic search engine optimization, HTML/CSS and JavaScript coding, Dreamweaver templates, project management within DSI, and web maintenance training and support.", "SAI"); pics[5] = new picRecord("05", "images/prt/g1_05.png", "images/prt/thumbnails/g1_05.png", 750, 731, 75, 73, 1, meta); pics[5].meta = new meta("Sierra Gold Website", "The second iteration of the redesigned home page for Sierra Gold. You can see the live site at www.sierragold.com.", "Audience/task analysis, website usability analysis, information architecture, website restructure and redesign, graphic design, Information Mapping and Writing for the Web content reorganization and editing, basic search engine optimization, HTML/CSS and JavaScript coding, Dreamweaver templates, project management within DSI, and web maintenance training and support.", "SAI"); pics[6] = new picRecord("06", "images/prt/g1_06.png", "images/prt/thumbnails/g1_06.png", 840, 433, 75, 39, 0, meta); pics[6].meta = new meta("Equanim Technologies Website", "The old (Before) and recoded (After) website. We modified the design slightly to improve web presentation. You can see the live site at www.equanimtech.com. ", "Recoding existing website to XHTML/CSS standards, light content editing, and ongoing website maintenance", "Equanim Technologies, Inc."); pics[7] = new picRecord("07", "images/prt/g1_07.png", "images/prt/thumbnails/g1_07.png", 840, 602, 75, 54, 0, meta); pics[7].meta = new meta("Equanim Technologies Website", "The old (Before) and recoded (After) website. We modified the design slightly to improve web presentation. You can see the live site at www.equanimtech.com. ", "Recoding existing website to XHTML/CSS standards, light content editing, and ongoing website maintenance", "Equanim Technologies, Inc."); pics[8] = new picRecord("08", "images/prt/g1_08.png", "images/prt/thumbnails/g1_08.png", 840, 442, 75, 39, 0, meta); pics[8].meta = new meta("60 Minute Strategic Plan Website", "The current (Before) and in-progress (After) website. We modified the design slightly to improve web presentation. This project is still in development, but you can see the current (before) site at www.60msp.com. ", "Search engine optimization, recoding existing website to XHTML/CSS standards, JavaScript coding, Flash demo design and development for 60MSP software (Captivate), redesign/recoding of the 60MSP e-commerce store, project management, and ongoing website maintenance", "60 Minute Strategic Plan, Inc."); pics[9] = new picRecord("09", "images/prt/g1_09.png", "images/prt/thumbnails/g1_09.png", 840, 488, 75, 44, 0, meta); pics[9].meta = new meta("60 Minute Strategic Plan Website", "The current (Before) and in-progress (After) website. We modified the design slightly to improve web presentation. This project is still in development, but you can see the current (before) site at www.60msp.com.", "Search engine optimization, recoding existing website to XHTML/CSS standards, JavaScript coding, Flash demo design and development for 60MSP software (Captivate), redesign/recoding of the 60MSP e-commerce store, project management, and ongoing website maintenance", "60 Minute Strategic Plan, Inc."); pics[10] = new picRecord("10", "images/prt/g1_10.png", "images/prt/thumbnails/g1_10.png", 750, 688, 75, 69, 0, meta); pics[10].meta = new meta("Cultivating Success Summit Website", "The home page for the Cultivating Success Summit website. You can see the live site at www.sia-us.com/cultivatingsuccess/.", "Information architecture and graphic design recommendations; usability analysis; graphics optimization; XHTML/CSS, PHP, and JavaScript coding; light content editing; project management (within DSI); training on PDF form development; and ongoing website maintenance.", "School Innovations & Advocacy"); pics[11] = new picRecord("11", "images/prt/g1_11.png", "images/prt/thumbnails/g1_11.png", 750, 910, 62, 75, 0, meta); pics[11].meta = new meta("Cultivating Success Summit Website", "A subpage on the Cultivating Success Summit website. You can see the live site at www.sia-us.com/cultivatingsuccess/.", "Information architecture and graphic design recommendations; usability analysis; graphics optimization; XHTML/CSS, PHP, and JavaScript coding; light content editing; project management (within DSI); training on PDF form development; and ongoing website maintenance.", "School Innovations & Advocacy"); pics[12] = new picRecord("12", "images/prt/g1_12.png", "images/prt/thumbnails/g1_12.png", 700, 646, 75, 69, 1, meta); pics[12].meta = new meta("PPMB Intranet", "A sample page from the redesigned Planning & Project Management Branch Intranet site developed for the California Department of Health Services. Graphic design was largely controlled by mandated state templates and the SharePoint environment.", "Audience/task analysis, website usability analysis, focus groups, gap analysis, information architecture, website restructure, Information Mapping and Writing for the Web content reorganization and editing, technical writing and editing, content research and source identification, quality assurance, HTML/CSS coding in a SharePoint environment, training for PPMB content authors and website maintenance staff, and project management (estimates, plans, schedules, and status reports).", "CDHS"); pics[13] = new picRecord("13", "images/prt/g1_13.jpg", "images/prt/thumbnails/g1_13.jpg", 546, 287, 75, 39, 1, meta); pics[13].meta = new meta("Legacy Capital Management Website", "A comp of the home page. You can see the live site at www.legacycapitalinc.com.", "Information architecture; graphic design; content development; HTML/CSS/JavaScript coding", "Legacy Capital Management, Inc."); pics[14] = new picRecord("14", "images/prt/g1_14.jpg", "images/prt/thumbnails/g1_14.jpg", 546, 543, 75, 74, 1, meta); pics[14].meta = new meta("Legacy Capital Management Website", "A comp of a subpage with an interactive process diagram. You can see the live site at www.legacycapitalinc.com.", "Information architecture; graphic design; content development; HTML/CSS/JavaScript coding", "Legacy Capital Management, Inc."); pics[15] = new picRecord("15", "images/prt/g1_15.jpg", "images/prt/thumbnails/g1_15.jpg", 496, 428, 75, 64, 1, meta); pics[15].meta = new meta("Touchstone Website", "A comp of the final home page design for the Touchstone 2001 technical communications competition website. The Society for Technical Communications (STC) is still using a version of this design today (stc-touchstone.org).", "Information architecture; graphic design", "Society for Technical Communication"); pics[16] = new picRecord("16", "images/prt/g1_16.jpg", "images/prt/thumbnails/g1_16.jpg", 496, 376, 75, 56, 1, meta); pics[16].meta = new meta("Touchstone Website", "A comp of the final subpage design for the Touchstone technical communications competition website.", "Information architecture; graphic design", "Society for Technical Communication"); pics[17] = new picRecord("17", "images/prt/g1_17.jpg", "images/prt/thumbnails/g1_17.jpg", 546, 287, 75, 39, 1, meta); pics[17].meta = new meta("InfoPros Website Redesign", "A comp of a draft design for the home page. InfoPros wanted to redesign its existing website and asked for a couple rough concepts based on their existing artwork and fonts. Ultimately, the redesign never went forward so the concepts weren't refined beyond this stage.", "Information architecture; graphic design", "Dana Ring"); pics[18] = new picRecord("18", "images/prt/g1_18.jpg", "images/prt/thumbnails/g1_18.jpg", 546, 287, 75, 39, 1, meta); pics[18].meta = new meta("InfoPros Website Redesign", "A comp of a draft design for the home page. InfoPros wanted to redesign its existing website and asked for a couple rough concepts based on their existing artwork and fonts. Ultimately, the redesign never went forward so the concepts weren't refined beyond this stage.", "Information architecture; graphic design", "Dana Ring"); pics[19] = new picRecord("19", "images/prt/g1_19.jpg", "images/prt/thumbnails/g1_19.jpg", 546, 298, 75, 40, 1, meta); pics[19].meta = new meta("InfoPros Website Redesign", "A comp of a draft design for a level-2 subpage. InfoPros wanted to redesign its existing website and asked for a couple rough concepts based on their existing artwork and fonts. Ultimately, the redesign never went forward so the concepts weren't refined beyond this stage.", "Information architecture; graphic design", "Dana Ring"); pics[20] = new picRecord("20", "images/prt/g1_20.jpg", "images/prt/thumbnails/g1_20.jpg", 546, 334, 75, 45, 1, meta); pics[20].meta = new meta("InfoPros Website Redesign", "A comp of a draft design for a level-4 subpage. InfoPros wanted to redesign its existing website and asked for a couple rough concepts based on their existing artwork and fonts. Ultimately, the redesign never went forward so the concepts weren't refined beyond this stage.", "Information architecture; graphic design", "Dana Ring"); pics[21] = new picRecord("21", "images/prt/g1_21.jpg", "images/prt/thumbnails/g1_21.jpg", 543, 300, 75, 41, 1, meta); pics[21].meta = new meta("Angel Legacy Website", "A comp of a draft design for the home page using client colors and photos.", "Information architecture; graphic design; HTML/CSS/JavaScript coding", "Angel Legacy LLC"); pics[22] = new picRecord("22", "images/prt/g1_22.jpg", "images/prt/thumbnails/g1_22.jpg", 543, 330, 75, 45, 1, meta); pics[22].meta = new meta("Angel Legacy Website", "A comp of a draft design for a level-3 subpage using client colors and photos.", "Information architecture; graphic design; HTML/CSS/JavaScript coding", "Angel Legacy LLC"); pics[23] = new picRecord("23", "images/prt/g1_23.jpg", "images/prt/thumbnails/g1_23.jpg", 546, 287, 75, 39, 1, meta); pics[23].meta = new meta("Dynesco Website", "A comp of the Dynesco home page. Client had very small budget and wanted a basic web presence (four pages) that incorporated their existing logo and this machine photo.", "Graphic design", "Dynesco"); pics[24] = new picRecord("24", "images/prt/g1_24.jpg", "images/prt/thumbnails/g1_24.jpg", 546, 287, 75, 39, 1, meta); pics[24].meta = new meta("Dynesco Website", "A comp of a Dynesco subpage. Client had very small budget and wanted a basic web presence.", "Graphic design", "Dynesco"); pics[25] = new picRecord("25", "images/prt/g2_00.jpg", "images/prt/thumbnails/g2_00.jpg", 562, 421, 75, 56, 0, meta); pics[25].meta = new meta("VSP Multimedia Marketing CD", "Screenshot from a multimedia CD that VSP sent to prospective customers. Included animation, video, music, and voiceover. This shot shows the main navigation page.", "Graphic design; multimedia development (Director/Shockwave); content editing", "Vision Service Plan"); pics[26] = new picRecord("26", "images/prt/g2_01.jpg", "images/prt/thumbnails/g2_01.jpg", 562, 421, 75, 56, 0, meta); pics[26].meta = new meta("VSP Multimedia Marketing CD", "Screenshot from a multimedia CD that VSP sent to prospective customers. Included animation, video, music, and voiceover. This shot shows a video of the CEO.", "Graphic design; multimedia development (Director/Shockwave); content editing", "Vision Service Plan"); pics[27] = new picRecord("27", "images/prt/g2_02.jpg", "images/prt/thumbnails/g2_02.jpg", 562, 421, 75, 56, 0, meta); pics[27].meta = new meta("VSP Multimedia Marketing CD", "Screenshot from a multimedia CD that VSP sent to prospective customers. Included animation, video, music, and voiceover. This shot shows how the page content changed (from the previous sample) as the CEO video played.", "Graphic design; multimedia development (Director/Shockwave); content editing", "Vision Service Plan"); pics[28] = new picRecord("28", "images/prt/g2_03.jpg", "images/prt/thumbnails/g2_03.jpg", 562, 421, 75, 56, 0, meta); pics[28].meta = new meta("VSP Multimedia Marketing CD", "Screenshot from a multimedia CD that VSP sent to prospective customers. Included animation, video, music, and voiceover. This shot shows how the page content changed (from the previous two samples) as the CEO video played.", "Graphic design; multimedia development (Director/Shockwave); content editing", "Vision Service Plan"); pics[29] = new picRecord("29", "images/prt/g2_04.jpg", "images/prt/thumbnails/g2_04.jpg", 562, 421, 75, 56, 0, meta); pics[29].meta = new meta("VSP Multimedia Marketing CD", "Screenshot from a multimedia CD that VSP sent to prospective customers. Included animation, video, music, and voiceover. This shot shows a page from the Member Services section.", "Graphic design; multimedia development (Director/Shockwave); content editing", "Vision Service Plan"); pics[30] = new picRecord("30", "images/prt/g2_05.jpg", "images/prt/thumbnails/g2_05.jpg", 562, 421, 75, 56, 0, meta); pics[30].meta = new meta("VSP Multimedia Marketing CD", "Screenshot from a multimedia CD that VSP sent to prospective customers. Included animation, video, music, and voiceover. This shot shows a page from the VSP programs section.", "Graphic design; multimedia development (Director/Shockwave); content editing", "Vision Service Plan"); pics[31] = new picRecord("31", "images/prt/g2_06.jpg", "images/prt/thumbnails/g2_06.jpg", 562, 421, 75, 56, 0, meta); pics[31].meta = new meta("VSP Multimedia Marketing CD", "Screenshot from a multimedia CD that VSP sent to prospective customers. Included animation, video, music, and voiceover. This shot shows how the previous VSP Programs page changed (from the previous sample) while the voiceover played.", "Graphic design; multimedia development (Director/Shockwave); content editing", "Vision Service Plan"); pics[32] = new picRecord("32", "images/prt/g2_07.jpg", "images/prt/thumbnails/g2_07.jpg", 420, 280, 75, 50, 0, meta); pics[32].meta = new meta("InfoPros Website Intro Animation", "Screenshot from a multimedia intro for the InfoPros website. Included animation and music.", "Graphic design; content development; multimedia development (Flash)", "InfoPros"); pics[33] = new picRecord("33", "images/prt/g2_10.jpg", "images/prt/thumbnails/g2_10.jpg", 627, 473, 75, 56, 0, meta); pics[33].meta = new meta("InfoPros Multimedia Marketing Demo", "Screenshot from a multimedia presentation that InfoPros ran at industry trade shows. Included animation and music.", "Graphic design; content editing; multimedia development (Director/Shockwave)", "InfoPros"); pics[34] = new picRecord("34", "images/prt/g3_01.jpg", "images/prt/thumbnails/g3_01.jpg", 546, 392, 75, 53, 0, meta); pics[34].meta = new meta("Caltrans Project Management WBT - Communication Management", 'Design and development of three PMBOK-based PM WBT courses: Communication; Procurement; and Scope, Schedule & Cost, offered through the College of Continuing Education at Sacramento State University. Included Flash animations and voiceover. Directed a team of six writers and developers and was responsible for resource scheduling, tracking hours, coordinating team efforts, and providing weekly status reports to the Project Manager. Courses employed a magazine metaphor and design. This shot shows the "newsstand" (course start page) where the student selects an "issue" (module).', "Instructional design; graphic design; content development; content editing; multimedia development (Flash); HTML/CSS/JavaScript coding; project management", "California Department of Transportation"); pics[35] = new picRecord("35", "images/prt/g3_02.jpg", "images/prt/thumbnails/g3_02.jpg", 546, 287, 75, 39, 0, meta); pics[35].meta = new meta("Caltrans Project Management WBT - Communication Management", 'Design and development of three PMBOK-based PM WBT courses: Communication; Procurement; and Scope, Schedule & Cost, offered through the College of Continuing Education at Sacramento State University. Included Flash animations and voiceover. Directed a team of six writers and developers and was responsible for resource scheduling, tracking hours, coordinating team efforts, and providing weekly status reports to the Project Manager. Courses employed a magazine metaphor and design. This shot shows the start page for the magazine "issue" (module) the student selected on the previous page.', "Instructional design; graphic design; content development; content editing; multimedia development (Flash); HTML/CSS/JavaScript coding; project management", "California Department of Transportation"); pics[36] = new picRecord("36", "images/prt/g3_03.jpg", "images/prt/thumbnails/g3_03.jpg", 546, 512, 75, 70, 1, meta); pics[36].meta = new meta("Caltrans Project Management WBT - Communication Management", 'Design and development of three PMBOK-based PM WBT courses: Communication; Procurement; and Scope, Schedule & Cost, offered through the College of Continuing Education at Sacramento State University. Included Flash animations and voiceover. Directed a team of six writers and developers and was responsible for resource scheduling, tracking hours, coordinating team efforts, and providing weekly status reports to the Project Manager. Courses employed a magazine metaphor and design. This shot shows an example of a typical page within a specific magazine "issue" (module).', "Instructional design; graphic design; content development; content editing; multimedia development (Flash); HTML/CSS/JavaScript coding; project management", "California Department of Transportation"); pics[37] = new picRecord("37", "images/prt/g3_04.jpg", "images/prt/thumbnails/g3_04.jpg", 546, 539, 75, 74, 0, meta); pics[37].meta = new meta("Caltrans Project Management WBT - Scope, Schedule, and Cost", 'Design and development of three PMBOK-based PM WBT courses: Communication; Procurement; and Scope, Schedule & Cost, offered through the College of Continuing Education at Sacramento State University. Included Flash animations and voiceover. Directed a team of six writers and developers and was responsible for resource scheduling, tracking hours, coordinating team efforts, and providing weekly status reports to the Project Manager. Courses employed a magazine metaphor and design. This shot shows the "newsstand" (course start page) where the student selects an "issue" (module).', "Instructional design; graphic design; content development; content editing; multimedia development (Flash); HTML/CSS/JavaScript coding; project management", "California Department of Transportation"); pics[38] = new picRecord("38", "images/prt/g3_05.jpg", "images/prt/thumbnails/g3_05.jpg", 546, 287, 75, 39, 0, meta); pics[38].meta = new meta("Caltrans Project Management WBT - Scope, Schedule, and Cost", 'Design and development of three PMBOK-based PM WBT courses: Communication; Procurement; and Scope, Schedule & Cost, offered through the College of Continuing Education at Sacramento State University. Included Flash animations and voiceover. Directed a team of six writers and developers and was responsible for resource scheduling, tracking hours, coordinating team efforts, and providing weekly status reports to the Project Manager. Courses employed a magazine metaphor and design. This shot shows the start page for the magazine "issue" (module) the student selected on the previous page.', "Instructional design; graphic design; content development; content editing; multimedia development (Flash); HTML/CSS/JavaScript coding; project management", "California Department of Transportation"); pics[39] = new picRecord("39", "images/prt/g3_06.jpg", "images/prt/thumbnails/g3_06.jpg", 546, 392, 75, 53, 0, meta); pics[39].meta = new meta("Caltrans Project Management WBT - Procurement Management", 'Design and development of three PMBOK-based PM WBT courses: Communication; Procurement; and Scope, Schedule & Cost, offered through the College of Continuing Education at Sacramento State University. Included Flash animations and voiceover. Directed a team of six writers and developers and was responsible for resource scheduling, tracking hours, coordinating team efforts, and providing weekly status reports to the Project Manager. Courses employed a magazine metaphor and design. This shot shows the "newsstand" (course start page) where the student selects an "issue" (module).', "Instructional design; graphic design; content development; content editing; multimedia development (Flash); HTML/CSS/JavaScript coding; project management", "California Department of Transportation"); pics[40] = new picRecord("40", "images/prt/g3_07.jpg", "images/prt/thumbnails/g3_07.jpg", 546, 287, 75, 39, 0, meta); pics[40].meta = new meta("Caltrans Project Management WBT - Procurement Management", 'Design and development of three PMBOK-based PM WBT courses: Communication; Procurement; and Scope, Schedule & Cost, offered through the College of Continuing Education at Sacramento State University. Included Flash animations and voiceover. Directed a team of six writers and developers and was responsible for resource scheduling, tracking hours, coordinating team efforts, and providing weekly status reports to the Project Manager. Courses employed a magazine metaphor and design. This shot shows the start page for the magazine "issue" (module) the student selected on the previous page.', "Instructional design; graphic design; content development; content editing; multimedia development (Flash); HTML/CSS/JavaScript coding; project management", "California Department of Transportation"); pics[41] = new picRecord("41", "images/prt/g3_08.jpg", "images/prt/thumbnails/g3_08.jpg", 546, 476, 75, 65, 1, meta); pics[41].meta = new meta("Caltrans Project Management WBT - Procurement Management", 'Design and development of three PMBOK-based PM WBT courses: Communication; Procurement; and Scope, Schedule & Cost, offered through the College of Continuing Education at Sacramento State University. Included Flash animations and voiceover. Directed a team of six writers and developers and was responsible for resource scheduling, tracking hours, coordinating team efforts, and providing weekly status reports to the Project Manager. Courses employed a magazine metaphor and design. This shot shows an example of a typical page within a specific magazine "issue" (module), with an interactive Flash animation.', "Instructional design; graphic design; content development; content editing; multimedia development (Flash); HTML/CSS/JavaScript coding; project management", "California Department of Transportation"); pics[42] = new picRecord("42", "images/prt/g3_09.jpg", "images/prt/thumbnails/g3_09.jpg", 543, 436, 75, 60, 1, meta); pics[42].meta = new meta("Calpine WBT", "Screenshot from an interactive WBT that included Flash animated demos showing how to navigate Calpine's Intranet and complete various documents. This shot shows the WBT start page.", "Instructional design; graphic design; content editing; multimedia development (Flash); HTML/CSS/JavaScript coding", "Calpine"); pics[43] = new picRecord("43", "images/prt/g3_10.jpg", "images/prt/thumbnails/g3_10.jpg", 543, 513, 75, 70, 1, meta); pics[43].meta = new meta("Calpine WBT", "Screenshot from an interactive WBT that included Flash animated demos showing how to navigate Calpine's Intranet and complete various documents. This shot shows the WBT start page.", "Instructional design; graphic design; content editing; multimedia development (Flash); HTML/CSS/JavaScript coding", "Calpine"); pics[44] = new picRecord("44", "images/prt/g3_11.png", "images/prt/thumbnails/g3_11.png", 650, 367, 75, 42, 1, meta); pics[44].meta = new meta("MirCal WBT", "Design and development of the MIRCal Computer Based Training (CBT) developed to provide initial project rollout training and ongoing training for internal and external users of the web-based MIRCal application on the OSHPD website. The CBT is approved by the American Health Information Management Association (AHIMA), California Hospital Information Association (CHIA), and the California Nursing Association. You can see the entire training at www.oshpd.ca.gov/MIRCal/training/CBT/index.html.", "Instructional design; graphic design; content editing; HTML/CSS/JavaScript coding", "OSHPD"); pics[45] = new picRecord("45", "images/prt/g3_12.png", "images/prt/thumbnails/g3_12.png", 650, 603, 75, 70, 1, meta); pics[45].meta = new meta("MirCal WBT", "Design and development of the MIRCal Computer Based Training (CBT) developed to provide initial project rollout training and ongoing training for internal and external users of the web-based MIRCal application on the OSHPD website. The CBT is approved by the American Health Information Management Association (AHIMA), California Hospital Information Association (CHIA), and the California Nursing Association. You can see the entire training at www.oshpd.ca.gov/MIRCal/training/CBT/index.html.", "Instructional design; graphic design; content editing; HTML/CSS/JavaScript coding", "OSHPD"); pics[46] = new picRecord("46", "images/prt/g3_13.jpg", "images/prt/thumbnails/g3_13.jpg", 503, 367, 75, 54, 0, meta); pics[46].meta = new meta("Intel Virtual Private Network WBT", "Screenshot from an interactive multimedia Flash WBT that included animation and sound. This shot shows the start page.", "Instructional design; graphic design; content development; multimedia development (Flash)", "Intel"); pics[47] = new picRecord("47", "images/prt/g3_14.jpg", "images/prt/thumbnails/g3_14.jpg", 546, 364, 75, 50, 1, meta); pics[47].meta = new meta("Caltrans Overview WBT", "Screenshot from an interactive multimedia Flash WBT that included animation, music, sound, and voiceover. This shot shows the main menu with the Orion rollover active.", "Instructional design; graphic design; some content editing; some multimedia development (Flash)", "California Department of Transportation"); pics[48] = new picRecord("48", "images/prt/g3_15.jpg", "images/prt/thumbnails/g3_15.jpg", 546, 364, 75, 50, 1, meta); pics[48].meta = new meta("Caltrans Overview WBT", "Screenshot from an interactive multimedia Flash WBT that included animation, music, sound, and voiceover. This shot shows a sample page. When the student selects a planet, the screen shown in the next sample displays.", "Instructional design; graphic design; some content editing; some multimedia development (Flash)", "California Department of Transportation"); pics[49] = new picRecord("49", "images/prt/g3_16.jpg", "images/prt/thumbnails/g3_16.jpg", 546, 364, 75, 50, 1, meta); pics[49].meta = new meta("Caltrans Overview WBT", "Screenshot from an interactive multimedia Flash WBT that included animation, music, sound, and voiceover. This shot shows the screen displayed when the student selects a planet from the solar system (shown in the previous sample).", "Instructional design; graphic design; some content editing; some multimedia development (Flash)", "California Department of Transportation"); pics[50] = new picRecord("50", "images/prt/g3_17.jpg", "images/prt/thumbnails/g3_17.jpg", 546, 364, 75, 50, 1, meta); pics[50].meta = new meta("Caltrans Overview WBT", "Screenshot from an interactive multimedia Flash WBT that included animation, music, sound, and voiceover. This shot shows a sample page.", "Instructional design; graphic design; some content editing; some multimedia development (Flash)", "California Department of Transportation"); pics[51] = new picRecord("51", "images/prt/g3_18.jpg", "images/prt/thumbnails/g3_18.jpg", 546, 364, 75, 50, 1, meta); pics[51].meta = new meta("Caltrans Overview WBT", "Screenshot from an interactive multimedia Flash WBT that included animation, music, sound, and voiceover. This shot shows a page with video and a corresponding transcript to meet accessibility guidelines.", "Instructional design; graphic design; some content editing; some multimedia development (Flash)", "California Department of Transportation"); pics[52] = new picRecord("52", "images/prt/g3_19.jpg", "images/prt/thumbnails/g3_19.jpg", 545, 425, 75, 58, 1, meta); pics[52].meta = new meta("Acordia Outlook WBT", "Screenshot from an interactive WBT developed for Acordia's Intranet. This shot shows the course start page. Also developed a similar Acordia New Employee Orientation WBT based on this template.", "Instructional design; graphic design; content development; HTML/CSS/JavaScript coding", "Acordia Inc."); pics[53] = new picRecord("53", "images/prt/g3_20.jpg", "images/prt/thumbnails/g3_20.jpg", 545, 392, 75, 53, 1, meta); pics[53].meta = new meta("Acordia Outlook WBT", "Screenshot from an interactive WBT developed for Acordia's Intranet. This shot shows a typical training page with color-coded callouts. Also developed a similar Acordia New Employee Orientation WBT based on this template.", "Instructional design; graphic design; content development; HTML/CSS/JavaScript coding", "Acordia Inc."); pics[54] = new picRecord("54", "images/prt/g3_21.jpg", "images/prt/thumbnails/g3_21.jpg", 545, 392, 75, 53, 1, meta); pics[54].meta = new meta("Acordia Outlook WBT", "Screenshot from an interactive WBT developed for Acordia's Intranet. This shot shows a typical training page with interactive color-coded callouts. When clicked, details on the selected screen element appear in a popup window. Also developed a similar Acordia New Employee Orientation WBT based on this template.", "Instructional design; graphic design; content development; HTML/CSS/JavaScript coding", "Acordia Inc."); /* pics[59] = new picRecord("59", "images/prt/g3_22.jpg", "images/prt/thumbnails/g3_22.jpg", 529, 321, 75, 45, 1, meta); pics[59].meta = new meta("Intel Solution Base WBT", "Screenshot from an interactive WBT developed for Intel's Intranet. This shot shows the course start page. Developed three other similar WBTs based on the same template.", "Instructional design; graphic design; content development; HTML/CSS/JavaScript coding", "Intel"); pics[60] = new picRecord("60", "images/prt/g3_23.jpg", "images/prt/thumbnails/g3_23.jpg", 529, 389, 75, 55, 1, meta); pics[60].meta = new meta("Intel Solution Base WBT", "Screenshot from an interactive WBT developed for Intel's Intranet. This shot shows a typical training page. Developed three other similar WBTs based on the same template.", "Instructional design; graphic design; content development; HTML/CSS/JavaScript coding", "Intel"); pics[61] = new picRecord("61", "images/prt/g4_01.jpg", "images/prt/thumbnails/g4_01.jpg", 577, 494, 75, 64, 0, meta); pics[61].meta = new meta("Employee Handbook Software Online Help", "Online help file included with the Employee Handbook software application. This shot shows a typical page with linked screenshot callouts.", "Information architecture; graphic design; content development; HTML/CSS/JavaScript coding", "California Chamber of Commerce"); pics[62] = new picRecord("62", "images/prt/g4_02.jpg", "images/prt/thumbnails/g4_02.jpg", 577, 591, 73, 75, 0, meta); pics[62].meta = new meta("Employee Handbook Software Online Help", "Online help file included with the Employee Handbook software application. This shot shows a typical page with linked screenshot callouts.", "Information architecture; graphic design; content development; HTML/CSS/JavaScript coding", "California Chamber of Commerce"); pics[63] = new picRecord("63", "images/prt/g4_03.jpg", "images/prt/thumbnails/g4_03.jpg", 577, 517, 75, 67, 0, meta); pics[63].meta = new meta("Employee Handbook Software Online Help", "Online help file included with the Employee Handbook software application. This shot shows a typical page.", "Information architecture; graphic design; content development; HTML/CSS/JavaScript coding", "California Chamber of Commerce"); pics[64] = new picRecord("64", "images/prt/g4_04.jpg", "images/prt/thumbnails/g4_04.jpg", 506, 298, 75, 44, 1, meta); pics[64].meta = new meta("Intel Traveler's Workstation Help", "Very basic task-based HTML help system for using a special kind of workstation while traveling to various Intel sites. Provided on Intel's Intranet. This shot shows the home page.", "Information architecture; graphic design; content development; HTML/CSS/JavaScript coding", "Intel"); pics[65] = new picRecord("65", "images/prt/g4_05.jpg", "images/prt/thumbnails/g4_05.jpg", 506, 488, 75, 72, 1, meta); pics[65].meta = new meta("Intel Traveler's Workstation Help", "Very basic task-based HTML help system for using a special kind of workstation while traveling to various Intel sites. Provided on Intel's Intranet. This shot shows a typical help page.", "Information architecture; graphic design; content development; HTML/CSS/JavaScript coding", "Intel"); pics[66] = new picRecord("66", "images/prt/g4_06.jpg", "images/prt/thumbnails/g4_06.jpg", 530, 304, 75, 43, 1, meta); pics[66].meta = new meta("HP Recruiting Online Candidate Help", "Very basic task-based HTML help system for a web-based application on HP's Intranet. This shot shows the home page.", "Information architecture; graphic design; content development; HTML/CSS/JavaScript coding", "Hewlett-Packard"); pics[67] = new picRecord("67", "images/prt/g4_07.jpg", "images/prt/thumbnails/g4_07.jpg", 530, 480, 75, 67, 1, meta); pics[67].meta = new meta("HP Recruiting Online Candidate Help", "Very basic task-based HTML help system for a web-based application on HP's Intranet. This shot shows a typical navigation page.", "Information architecture; graphic design; content development; HTML/CSS/JavaScript coding", "Hewlett-Packard"); pics[68] = new picRecord("68", "images/prt/g5_01.jpg", "images/prt/thumbnails/g5_01.jpg", 415, 533, 58, 75, 0, meta); pics[68].meta = new meta("California Chamber of Commerce Publications", "Designed and developed three Human Resource books in the Best Practices series published by the California Chamber of Commerce. This shot shows a typical page.", "Information architecture; graphic design; content development; content editing", "California Chamber of Commerce"); pics[69] = new picRecord("69", "images/prt/g5_02.jpg", "images/prt/thumbnails/g5_02.jpg", 415, 533, 58, 75, 0, meta); pics[69].meta = new meta("California Chamber of Commerce Publications", "Designed and developed three Human Resource books in the Best Practices series published by the California Chamber of Commerce. This shot shows a typical page.", "Information architecture; graphic design; content development; content editing", "California Chamber of Commerce"); pics[70] = new picRecord("70", "images/prt/g5_03.jpg", "images/prt/thumbnails/g5_03.jpg", 415, 533, 58, 75, 0, meta); pics[70].meta = new meta("California Chamber of Commerce Publications", "Designed and developed the Human Resource Essentials book published by the California Chamber of Commerce. Each chapter uses a different spot color. This shot shows a typical page.", "Information architecture; graphic design; content development; content editing", "California Chamber of Commerce"); pics[71] = new picRecord("71", "images/prt/g5_04.jpg", "images/prt/thumbnails/g5_04.jpg", 415, 533, 58, 75, 0, meta); pics[71].meta = new meta("California Chamber of Commerce Publications", "Designed and developed the Human Resource Essentials book published by the California Chamber of Commerce. Each chapter uses a different spot color. This shot shows a typical page.", "Information architecture; graphic design; content development; content editing", "California Chamber of Commerce"); pics[72] = new picRecord("72", "images/prt/g5_05.jpg", "images/prt/thumbnails/g5_05.jpg", 415, 533, 58, 75, 0, meta); pics[72].meta = new meta("California Chamber of Commerce Publications", "Designed and developed the Human Resource Essentials book published by the California Chamber of Commerce. Each chapter uses a different spot color. This shot shows a typical page.", "Information architecture; graphic design; content development; content editing", "California Chamber of Commerce"); pics[73] = new picRecord("73", "images/prt/g5_06.jpg", "images/prt/thumbnails/g5_06.jpg", 470, 608, 57, 75, 0, meta); pics[73].meta = new meta("B&H Labeling Operations Guide", "Designed and developed a task-based Operations Guide for a container-labeling machinery manufacturer. This shot shows the guide cover.", "Information architecture; graphic design; content development", "B&H Labeling Systems"); pics[74] = new picRecord("74", "images/prt/g5_07.jpg", "images/prt/thumbnails/g5_07.jpg", 470, 608, 57, 75, 0, meta); pics[74].meta = new meta("B&H Labeling Operations Guide", "Designed and developed a task-based Operations Guide for a container-labeling machinery manufacturer. This shot shows the guide contents page.", "Information architecture; graphic design; content development", "B&H Labeling Systems"); pics[75] = new picRecord("75", "images/prt/g5_08.jpg", "images/prt/thumbnails/g5_08.jpg", 470, 608, 57, 75, 0, meta); pics[75].meta = new meta("B&H Labeling Operations Guide", "Designed and developed a task-based Operations Guide for a container-labeling machinery manufacturer. Content made extensive use of photos of the actual machine to illustrate how to complete tasks. This shot shows a typical page.", "Information architecture; graphic design; content development", "B&H Labeling Systems"); pics[76] = new picRecord("76", "images/prt/g5_09.jpg", "images/prt/thumbnails/g5_09.jpg", 430, 556, 58, 75, 0, meta); pics[76].meta = new meta("Output Technology Systems", "Designed an developed a custom Word template for OTS to use to create proposals for prospective customers. This shot shows a typical page.", "Graphic design; custom Word template development (Visual Basic)", "Yes, but unknown"); pics[77] = new picRecord("77", "images/prt/g5_10.jpg", "images/prt/thumbnails/g5_10.jpg", 430, 556, 58, 75, 0, meta); pics[77].meta = new meta("Output Technology Systems", "Designed an developed a custom Word template for OTS to use to create proposals for prospective customers. This shot shows a typical page.", "Graphic design; custom Word template development (Visual Basic)", "Yes, but unknown"); pics[78] = new picRecord("78", "images/prt/g5_11.jpg", "images/prt/thumbnails/g5_11.jpg", 430, 556, 58, 75, 0, meta); pics[78].meta = new meta("Mariemont Proposal", "Designed and developed a custom Word template for Mariemont to use to create proposals for government contracts. This shot shows the cover page.", "Graphic design; custom Word template development (Visual Basic); content editing", "Yes, but unknown"); pics[79] = new picRecord("79", "images/prt/g5_12.jpg", "images/prt/thumbnails/g5_12.jpg", 430, 556, 58, 75, 0, meta); pics[79].meta = new meta("Mariemont Proposal", "Designed and developed a custom Word template for Mariemont to use to create proposals for government contracts. This shot shows a typical page with a technical illustration.", "Graphic design; custom Word template development (Visual Basic); content editing", "Yes, but unknown"); pics[80] = new picRecord("80", "images/prt/g5_13.jpg", "images/prt/thumbnails/g5_13.jpg", 430, 556, 58, 75, 0, meta); pics[80].meta = new meta("Mariemont Proposal", "Designed and developed a custom Word template for Mariemont to use to create proposals for government contracts. This shot shows a typical page.", "Graphic design; custom Word template development (Visual Basic); content editing", "Yes, but unknown"); pics[81] = new picRecord("81", "images/prt/g5_14.jpg", "images/prt/thumbnails/g5_14.jpg", 424, 548, 58, 75, 0, meta); pics[81].meta = new meta("GTE/Ameritech User Guide", "Designed and developed a custom Word template for GTE/Ameritech internal documents, then used this template to create a disaster recovery guide and a template user guide. This shot shows the cover page of the template guide.", "Graphic design; custom Word template development (Visual Basic); content development", "Yes, but unknown"); pics[82] = new picRecord("82", "images/prt/g5_15.jpg", "images/prt/thumbnails/g5_15.jpg", 424, 548, 58, 75, 0, meta); pics[82].meta = new meta("GTE/Ameritech User Guide", "Designed and developed a custom Word template for GTE/Ameritech internal documents, then used this template to create an disaster recovery guide and a template user guide. This shot shows the table of contents for the template user guide.", "Graphic design; custom Word template development (Visual Basic); content development", "Yes, but unknown"); pics[83] = new picRecord("83", "images/prt/g5_16.jpg", "images/prt/thumbnails/g5_16.jpg", 424, 548, 58, 75, 0, meta); pics[83].meta = new meta("GTE/Ameritech User Guide", "Designed and developed a custom Word template for GTE/Ameritech internal documents, then used this template to create an disaster recovery guide and a template user guide. This shot shows a chapter start page in the template user guide.", "Graphic design; custom Word template development (Visual Basic); content development", "Yes, but unknown"); pics[84] = new picRecord("84", "images/prt/g5_17.jpg", "images/prt/thumbnails/g5_17.jpg", 424, 548, 58, 75, 0, meta); pics[84].meta = new meta("GTE/Ameritech User Guide", "Designed and developed a custom Word template for GTE/Ameritech internal documents, then used this template to create an disaster recovery guide and a template user guide. This shot shows a typical process page in the disaster recovery guide.", "Graphic design; custom Word template development (Visual Basic); content development", "Yes, but unknown"); pics[85] = new picRecord("85", "images/prt/g5_18.jpg", "images/prt/thumbnails/g5_18.jpg", 424, 548, 58, 75, 0, meta); pics[85].meta = new meta("North Valley Breast Clinic Requirements/Design Document", "Designed and developed a design document for a custom software application for patient tracking. Performed all requirements gathering, systems analysis, system design, interface design, and documentation. Worked with a database designer for the low-level technical design. This shot shows the cover page.", "Business and requirements analysis; systems design; interface design; information architecture; graphic design; content development; technical illustration", "Yes, but unknown"); pics[86] = new picRecord("86", "images/prt/g5_19.jpg", "images/prt/thumbnails/g5_19.jpg", 424, 548, 58, 75, 0, meta); pics[86].meta = new meta("North Valley Breast Clinic Requirements/Design Document", "Designed and developed a design document for a custom software application for patient tracking. Performed all requirements gathering, systems analysis, system design, interface design, and documentation. Worked with a database designer for the low-level technical design. This shot shows the table of contents.", "Business and requirements analysis; systems design; interface design; information architecture; graphic design; content development; technical illustration", "Yes, but unknown"); pics[87] = new picRecord("87", "images/prt/g5_20.jpg", "images/prt/thumbnails/g5_20.jpg", 424, 548, 58, 75, 0, meta); pics[87].meta = new meta("North Valley Breast Clinic Requirements/Design Document", "Designed and developed a design document for a custom software application for patient tracking. Performed all requirements gathering, systems analysis, system design, interface design, and documentation. Worked with a database designer for the low-level technical design. This shot shows a typical page.", "Business and requirements analysis; systems design; interface design; information architecture; graphic design; content development; technical illustration", "Yes, but unknown"); pics[89] = new picRecord("88", "images/prt/g5_21.jpg", "images/prt/thumbnails/g5_21.jpg", 702, 543, 75, 58, 0, meta); pics[89].meta = new meta("North Valley Breast Clinic Requirements/Design Document", "Designed and developed a design document for a custom software application for patient tracking. Performed all requirements gathering, systems analysis, system design, interface design, and documentation. Worked with a database designer for the low-level technical design. This shot shows a functional overview diagram.", "Business and requirements analysis; systems design; interface design; information architecture; graphic design; content development; technical illustration", "Yes, but unknown"); */ var thumbs = new Array(); for (ctr = 0; ctr < pics.length; ctr++) { thumbs[ctr] = new String(); thumbs[ctr] = "" + pics[ctr].meta.project + ""; } var allThumbs = thumbs.join(" "); function setMsg(msg) { window.status = msg; return true; } function setObjects() { getObject("picture"); getObject("project"); getObject("desc"); getObject("tasks"); getObject("pcopyright"); setContent(0); } // set compatible object model function getObject(obj) { if (document.getElementById) { if (typeof obj == "string") return document.getElementById(obj).innerHTML; else return obj.innerHTML; } return null; } // initialize first text appearing on page function setContent(pNum) { if (pics[pNum].border == 1) pClass="pborder"; else pClass=""; curFile = "" + pics[pNum].meta.project + ""; parent.document.getElementById("picture").innerHTML = curFile; parent.document.getElementById("project").innerHTML = pics[pNum].meta.project; parent.document.getElementById("desc").innerHTML = pics[pNum].meta.desc; parent.document.getElementById("tasks").innerHTML = pics[pNum].meta.tasks; parent.document.getElementById("pcopyright").innerHTML = pics[pNum].meta.copyright; curPic = pics[pNum].picNum; /* curFile = pics[pNum].pName; curProj = pics[pNum].meta.project; curDesc = pics[pNum].meta.desc; curTasks = pics[pNum].meta.taks; curCopy = pics[pNum].meta.copyright; */ } function nextPic() { if (curPic < (pics.length - 1)) curPic++; else curPic = 0; setContent(curPic); } function prevPic() { if (curPic > 0 && curPic < pics.length) curPic = curPic - 1; else curPic = pics.length - 1; setContent(curPic); }