Stace Felder
I'm a web developer focused on content development strategies and creating the code to make it all happen.
The Challenge: Share individual video narratives to present the student as a multi-faceted individual, not defined by any single label or role, and with overlapping interests and passions. Visually reinforce the relationship of each student identity to the other while presenting 15 videos in a compact, mobile-friendly layout.
Solution: A satellite model in which the student is at the center with the different roles in an outer circle. User controls animate the outer circle, rotating in either direction to select different roles and displaying the appropriate, related video in the center.
Tools used: HTML, CSS, jQuery
Content
From data structure and information architecture to writing and editing, content is what I'm all about. You, your company, your organization - you've got a lot of information that you need to share. But it needs to be organized and presented in a way that makes sense to your audience. I can do that. This is what I mean
Code
When it comes time to turn your content plans into reality, you want fast, responsive code that delivers your information to your users. You also want code that's easy to maintain and update as well as being flexible and powerful enough to adapt to changes. Take a look at what I've done
Content
Creation
Report, write and edit daily news stories for the San Francisco CBS affiliate. Develop, research and produce investigative news stories.
Local news programs for San Francisco Fox affiliate KTVU. In my role of Field Producer, I covered breaking news events, wrote daily news stories, and developed, researched and produced investigative reports.
A weekly national television show about computing and the digital world, CNET Central aimed to explore and explain new technologies. As the Producer, I wrote and edited scripts, created show line-ups, oversaw videotaping and post-production, and managed online components.
News and information for Live Oak School employees. In my role as web editor, I write and edit articles, emphasizing clarity and brevity. Pieces tend toward straightforward reports of school activities as well as administrative directives and guidance.
News and information for current families and students of Live Oak School. As web editor, I write and/or edit all articles, develop the editorial voice, and maintain the consistency of style, while being engaging and informative. The writing style is journalistic while pieces include previews of upcoming events, coverage of school activities and simple, informational announcements.
Strategy
Live Oak needed to move away from its system of communicating with employees via email; multiple updates, lost attachments and sheer traffic made it difficult to effectively share and later find information. The goal of The Loop was to create a central, easily accessible location for that information; the challenge was to make it a daily destination for the staff, a place they would be sure to check every day.
My solution was to create a dashboard front page, giving the user a snapshot of the day ahead. Items include a daily message from the Head of School, news, announcements, events, meetings and attendance as well as a personalized greeting, current weather and even raffle prizes.
Deeper content includes employee policies and guidelines, curriculum maps, and emergency information. Tools include directory, calendar, resource scheduler and substitute teacher locator. Building on the structure of the Family Tree site, labeling and navigation were already familiar.
At Live Oak School, the challenge was to transition from a paper, hand-delivered newsletter with linear content to a non-linear, digitally-delivered web site while keeping a structure familiar to both readers and authors and also streamlining and modernizing the information.
My solution was to implement a refined data structure with understandable hierarchies, simple navigation and clear labeling. The data structure also allows the site to function as a publishing platform for multiple distribution channels, including mobile devices, Facebook, Twitter, RSS and Calendar feeds and a weekly email newsletter.
Traditionally a financial services company, Charles Schwab was considering if and how it should integrate audio and video content at Schwab.com. Working as a Content Development consultant, I worked with the eCommunications group, assisting with defining content-driven goals, planning strategies and identifying potential partners.
As a leading online financial services company, E*Trade sought to improve customer retention through the integration of editorial content. As Director of Digital Media, I worked with senior management to define the vision and refine content-driven goals. I also developed programming and distribution strategies and identified content and delivery channels for partnership, aggregation and acquisition.
CNET Television was comprised of six domestically and internationally distributed television shows, a radio program and streaming video clips. In my roles as Executive Producer and Senior Producer, I oversaw the editorial content of all production. Additionally, I developed new programming, improved integration with other CNET web properties, and created new distribution opportunities with a searchable video database.
Creation
Strategy
Report, write and edit daily news stories for the San Francisco CBS affiliate. Develop, research and produce investigative news stories.
Live Oak needed to move away from its system of communicating with employees via email; multiple updates, lost attachments and sheer traffic made it difficult to effectively share and later find information. The goal of The Loop was to create a central, easily accessible location for that information; the challenge was to make it a daily destination for the staff, a place they would be sure to check every day.
My solution was to create a dashboard front page, giving the user a snapshot of the day ahead. Items include a daily message from the Head of School, news, announcements, events, meetings and attendance as well as a personalized greeting, current weather and even raffle prizes.
Deeper content includes employee policies and guidelines, curriculum maps, and emergency information. Tools include directory, calendar, resource scheduler and substitute teacher locator. Building on the structure of the Family Tree site, labeling and navigation were already familiar.
Local news programs for San Francisco Fox affiliate KTVU. In my role of Field Producer, I covered breaking news events, wrote daily news stories, and developed, researched and produced investigative reports.
At Live Oak School, the challenge was to transition from a paper, hand-delivered newsletter with linear content to a non-linear, digitally-delivered web site while keeping a structure familiar to both readers and authors and also streamlining and modernizing the information.
My solution was to implement a refined data structure with understandable hierarchies, simple navigation and clear labeling. The data structure also allows the site to function as a publishing platform for multiple distribution channels, including mobile devices, Facebook, Twitter, RSS and Calendar feeds and a weekly email newsletter.
A weekly national television show about computing and the digital world, CNET Central aimed to explore and explain new technologies. As the Producer, I wrote and edited scripts, created show line-ups, oversaw videotaping and post-production, and managed online components.
Traditionally a financial services company, Charles Schwab was considering if and how it should integrate audio and video content at Schwab.com. Working as a Content Development consultant, I worked with the eCommunications group, assisting with defining content-driven goals, planning strategies and identifying potential partners.
News and information for Live Oak School employees. In my role as web editor, I write and edit articles, emphasizing clarity and brevity. Pieces tend toward straightforward reports of school activities as well as administrative directives and guidance.
As a leading online financial services company, E*Trade sought to improve customer retention through the integration of editorial content. As Director of Digital Media, I worked with senior management to define the vision and refine content-driven goals. I also developed programming and distribution strategies and identified content and delivery channels for partnership, aggregation and acquisition.
News and information for current families and students of Live Oak School. As web editor, I write and/or edit all articles, develop the editorial voice, and maintain the consistency of style, while being engaging and informative. The writing style is journalistic while pieces include previews of upcoming events, coverage of school activities and simple, informational announcements.
CNET Television was comprised of six domestically and internationally distributed television shows, a radio program and streaming video clips. In my roles as Executive Producer and Senior Producer, I oversaw the editorial content of all production. Additionally, I developed new programming, improved integration with other CNET web properties, and created new distribution opportunities with a searchable video database.
Code
Apps
The Challenge: Share individual video narratives to present the student as a multi-faceted individual, not defined by any single label or role, and with overlapping interests and passions. Visually reinforce the relationship of each student identity to the other while presenting 15 videos in a compact, mobile-friendly layout.
Solution: A satellite model in which the student is at the center with the different roles in an outer circle. User controls animate the outer circle, rotating in either direction to select different roles and displaying the appropriate, related video in the center.
Tools used: HTML, CSS, jQuery
The issue: Dismiss up to 290 students within 30 minutes from multiple locations through multiple exits.
The need: Real-time, up-to-the second data on each student, their location, where they’re needed and when, all accessible to teachers, dismissal staff, front desk personnel and after-school program coordinators throughout the campus.
The solution: A web app designed and optimized to run on tablets on the street, phones in the hallways, desktops in the classrooms and projectors in common spaces. Students are called, tracked, and dismissed with simple taps or clicks while all data is stored in a searchable and sortable archive. Built as an app but packaged as a WordPress plugin to provide user authentication and data.
Tools used: HTML, CSS, PHP, jQuery, AJAX, WordPress, MySQL
This app requires a user to submit a valid email address in order to download content. To verify, the user is sent a unique, time-sensitive url to effect the download. Tools for the site owner include tracking downloads by content, email address, name and date.
Tools used: HTML, CSS, PHP, WordPress, MySQL
A tool for creating and publishing an email newsletter from recently published web site articles. Functionality includes flexible story selection and ordering, inclusion of photos, and custom messaging options. Additional features include html and plain text templates with preview and test sends as well as mail list management. Backend tools include full anti-spam compliance and advanced tracking tools.
Tools used: HTML, CSS, PHP, WordPress, MySQL, MailChimp API
A tool for securing substitute teachers. Functionality includes lists of approved subs and tracking of teacher absences. Custom features include an email and text message notification system for contacting multiple substitute candidates.
Tools used: HTML, CSS, PHP, WordPress, MySQL
Reservation system for shared resources throughout the school, including computers, rooms and vehicles. Functionality includes multiple view options plus recurring reservations by day, week, month or year with duration by date or repetition. Features include management tools for adding, editing and deleting resources as well as creating resource groups and grouping and setting access privileges.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL
Comprehensive listing of school events with filters for individual calendars (ie Athletics, Admissions) and day or date range. The Google Calendar API is used to access event data while WordPress allows linked data, offering additional information through related articles and announcements.
Tools: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Calendar API
A directory of students, families and staff. Functionality includes simple and advanced search, filters by name, grade and role. Features include mapping through Google Maps, printable layouts and group email tools.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Maps API
Plugins
Integrates LDAP authentication with native WordPress login functions. The plugin works on both single-site and multi-site installations, allows for both network and local users, and maintains user roles and capabilities. Also supports LDAP user groups.
Tools used: PHP, WordPress, MySQL
Creates a custom login screen for users. Customization can be as simple as adding a company logo to the default WordPress login or as complex as completely recreating the login to match an existing web site.
Tools: HTML, CSS, PHP, WordPress
Adds links to in-house help pages or guides to the default WordPress on-screen help menus.
Tools used: HTML, CSS, PHP, WordPress
Adds items to an author portfolio, including publication name, dates, link and PDF attachment of the work. Uses a custom post type, making items easily added to page templates as well as managed by the author.
Tools used: HTML, CSS, PHP, WordPress
Adds resume items, including job title, description, dates and location. By using a custom post type, authors can easily see items in the backend while items are also easily displayed via templates for web visitors.
Tools used: HTML, CSS, PHP, WordPress
Add a signup list to posts. Authors can create up to five columns (ie, name, email, phone) as well as add numbering and specify number of rows. Users can add and edit data from the post without going in to the WordPress admin area.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL
Add dates and times to a post. The plugin allows for multiple dates and times, as well as all day events. All events are assigned to a custom, user-defined category for easy retrieval and display. All events are also added to user-specified Google Calendars, with a post excerpt as the description.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Cal API
Add homework assignments to class websites. Allows subject, section and due date with both date and subject filters.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL
Sites
A startup aimed at connecting the community of independent food pioneers by offering resources for small entrepreneurs in need of training, connections, and support. Features include news articles and complex search and mapping with distance, category, and keyword filtering.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Maps API
A tool of the Live Oak School Board of Trustees, the site’s main goal is to share the reports from various board committees and school departments. It also functions as a repository for much of the board’s internal documentation while also offering messaging and discussion capabilities.
Tools used: HTML, CSS, PHP, WordPress
In addition to the Family Tree site, Live Oak School also publishes a site for each individual class, maintained by the respective teachers. In the lower school, the sites are primarily newsletters, aimed at parents and highlight events and activities from the classroom. In middle school, the sites are aimed at the students and designed as an adjunct to the classroom. Reference material, assignments, announcements and homework all presented in a single location for the student.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Maps API
Home of the band Dogpatch. Features gig listing, photo gallery, music store and email list signups.
Tools used: HTML, CSS, PHP, JavaScript, WordPress
View the site
Find food trucks and carts in the San Francisco area. Bold and stylish design along with features that include Yelp reviews, Twitter locations, Google maps and news articles from local and national media.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Twitter API, Yelp API
A freelance writer’s portfolio, featuring responsive layout for viewing on desktops, tablets and mobiles; printable resume and filters for viewing work by genre and style.
Tools used: HTML, CSS, PHP, WordPress
View the site
A playwright’s portfolio, featuring specialized layouts and search filters to view work by both type and genre. The site also includes a custom plugin to verify a user’s email address prior to downloading a script.
Tools used: HTML, CSS, PHP, WordPress
View the site
Staff intranet offering news and information for Live Oak School employees. The front page uses a dashboard design, offering the day’s news, events, attendance, meetings and even weather. Custom features include a system to secure and track substitute teachers, a resource management and scheduler tool, and curriculum matrix. Similar to the Family Tree in presenting announcements, calendars and directories, this site also offers forms, policies, and help sections.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Maps API
News and information for current families and students of Live Oak School. Features include announcements, segmented calendar, searchable directory with maps and email functions, as well as sections for the board of trustees, the parent organization, the after school program and the parent handbook.
The first version moved the school from paper-based content delivery to online distribution. As a transitional step, many of the familiar paper-based features were recreated.
V.2 introduced a streamlined information structure as well as the use of multiple distribution channels to suit user preferences for consuming information. Content published to the web site was also pushed out to mobile devices, Facebook, Twitter, RSS and Calendar feeds as well as published as a weekly email newsletter.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Maps API, MailChimp API
Apps
Plugins
Sites
The Challenge: Share individual video narratives to present the student as a multi-faceted individual, not defined by any single label or role, and with overlapping interests and passions. Visually reinforce the relationship of each student identity to the other while presenting 15 videos in a compact, mobile-friendly layout.
Solution: A satellite model in which the student is at the center with the different roles in an outer circle. User controls animate the outer circle, rotating in either direction to select different roles and displaying the appropriate, related video in the center.
Tools used: HTML, CSS, jQuery
Integrates LDAP authentication with native WordPress login functions. The plugin works on both single-site and multi-site installations, allows for both network and local users, and maintains user roles and capabilities. Also supports LDAP user groups.
Tools used: PHP, WordPress, MySQL
A startup aimed at connecting the community of independent food pioneers by offering resources for small entrepreneurs in need of training, connections, and support. Features include news articles and complex search and mapping with distance, category, and keyword filtering.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Maps API
The issue: Dismiss up to 290 students within 30 minutes from multiple locations through multiple exits.
The need: Real-time, up-to-the second data on each student, their location, where they’re needed and when, all accessible to teachers, dismissal staff, front desk personnel and after-school program coordinators throughout the campus.
The solution: A web app designed and optimized to run on tablets on the street, phones in the hallways, desktops in the classrooms and projectors in common spaces. Students are called, tracked, and dismissed with simple taps or clicks while all data is stored in a searchable and sortable archive. Built as an app but packaged as a WordPress plugin to provide user authentication and data.
Tools used: HTML, CSS, PHP, jQuery, AJAX, WordPress, MySQL
Creates a custom login screen for users. Customization can be as simple as adding a company logo to the default WordPress login or as complex as completely recreating the login to match an existing web site.
Tools: HTML, CSS, PHP, WordPress
A tool of the Live Oak School Board of Trustees, the site’s main goal is to share the reports from various board committees and school departments. It also functions as a repository for much of the board’s internal documentation while also offering messaging and discussion capabilities.
Tools used: HTML, CSS, PHP, WordPress
This app requires a user to submit a valid email address in order to download content. To verify, the user is sent a unique, time-sensitive url to effect the download. Tools for the site owner include tracking downloads by content, email address, name and date.
Tools used: HTML, CSS, PHP, WordPress, MySQL
Adds links to in-house help pages or guides to the default WordPress on-screen help menus.
Tools used: HTML, CSS, PHP, WordPress
In addition to the Family Tree site, Live Oak School also publishes a site for each individual class, maintained by the respective teachers. In the lower school, the sites are primarily newsletters, aimed at parents and highlight events and activities from the classroom. In middle school, the sites are aimed at the students and designed as an adjunct to the classroom. Reference material, assignments, announcements and homework all presented in a single location for the student.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Maps API
A tool for creating and publishing an email newsletter from recently published web site articles. Functionality includes flexible story selection and ordering, inclusion of photos, and custom messaging options. Additional features include html and plain text templates with preview and test sends as well as mail list management. Backend tools include full anti-spam compliance and advanced tracking tools.
Tools used: HTML, CSS, PHP, WordPress, MySQL, MailChimp API
Adds items to an author portfolio, including publication name, dates, link and PDF attachment of the work. Uses a custom post type, making items easily added to page templates as well as managed by the author.
Tools used: HTML, CSS, PHP, WordPress
Home of the band Dogpatch. Features gig listing, photo gallery, music store and email list signups.
Tools used: HTML, CSS, PHP, JavaScript, WordPress
View the site
A tool for securing substitute teachers. Functionality includes lists of approved subs and tracking of teacher absences. Custom features include an email and text message notification system for contacting multiple substitute candidates.
Tools used: HTML, CSS, PHP, WordPress, MySQL
Adds resume items, including job title, description, dates and location. By using a custom post type, authors can easily see items in the backend while items are also easily displayed via templates for web visitors.
Tools used: HTML, CSS, PHP, WordPress
Find food trucks and carts in the San Francisco area. Bold and stylish design along with features that include Yelp reviews, Twitter locations, Google maps and news articles from local and national media.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Twitter API, Yelp API
Reservation system for shared resources throughout the school, including computers, rooms and vehicles. Functionality includes multiple view options plus recurring reservations by day, week, month or year with duration by date or repetition. Features include management tools for adding, editing and deleting resources as well as creating resource groups and grouping and setting access privileges.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL
Add a signup list to posts. Authors can create up to five columns (ie, name, email, phone) as well as add numbering and specify number of rows. Users can add and edit data from the post without going in to the WordPress admin area.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL
A freelance writer’s portfolio, featuring responsive layout for viewing on desktops, tablets and mobiles; printable resume and filters for viewing work by genre and style.
Tools used: HTML, CSS, PHP, WordPress
View the site
Comprehensive listing of school events with filters for individual calendars (ie Athletics, Admissions) and day or date range. The Google Calendar API is used to access event data while WordPress allows linked data, offering additional information through related articles and announcements.
Tools: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Calendar API
Add dates and times to a post. The plugin allows for multiple dates and times, as well as all day events. All events are assigned to a custom, user-defined category for easy retrieval and display. All events are also added to user-specified Google Calendars, with a post excerpt as the description.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Cal API
A playwright’s portfolio, featuring specialized layouts and search filters to view work by both type and genre. The site also includes a custom plugin to verify a user’s email address prior to downloading a script.
Tools used: HTML, CSS, PHP, WordPress
View the site
A directory of students, families and staff. Functionality includes simple and advanced search, filters by name, grade and role. Features include mapping through Google Maps, printable layouts and group email tools.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Maps API
Add homework assignments to class websites. Allows subject, section and due date with both date and subject filters.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL
Staff intranet offering news and information for Live Oak School employees. The front page uses a dashboard design, offering the day’s news, events, attendance, meetings and even weather. Custom features include a system to secure and track substitute teachers, a resource management and scheduler tool, and curriculum matrix. Similar to the Family Tree in presenting announcements, calendars and directories, this site also offers forms, policies, and help sections.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Maps API
News and information for current families and students of Live Oak School. Features include announcements, segmented calendar, searchable directory with maps and email functions, as well as sections for the board of trustees, the parent organization, the after school program and the parent handbook.
The first version moved the school from paper-based content delivery to online distribution. As a transitional step, many of the familiar paper-based features were recreated.
V.2 introduced a streamlined information structure as well as the use of multiple distribution channels to suit user preferences for consuming information. Content published to the web site was also pushed out to mobile devices, Facebook, Twitter, RSS and Calendar feeds as well as published as a weekly email newsletter.
Tools used: HTML, CSS, PHP, JavaScript, WordPress, MySQL, Google Maps API, MailChimp API