Accessibility House

Everyone should be able to access and enjoy this house.

Accessibility House is a demonstration of WCAG's first universal design, featuring hidden Easter eggs. It is a convergence of gamification and inclusive design.

Product Design

Process of imagining, creating, and iterating solutions that solve users' problems or address specific needs in a given market. The key to successful product design is understanding the end-user customer, the person for whom the product is being created. Accessibility House provides compelling designs that added couture for business accessibility.

View Silicon Hackers' Profile

Skill

Vision

Journey Map

DA

Data Architect

Designs and manages data systems, sets policies for data storage and access, coordinate data sources, and integrates new data technologies and visualizations into existing IT infrastructures.

CW

Creative Writing

Decades of reading the most important ideas in technical documentation, user journals, and religious research; essential for understanding the complexities of human interactions.

Visit Spirit Faith Ministry

UML

Universal Modeling Language

Uml is a general-purpose modeling language for software engineering, used to visualize the design of a system. It is a developmental modeling language used to provide a standard way to do so, and is used in the field of software engineering.

IA

Information Architect

Organizing content in labeled and scalable way to find information, utilizing the site map to visualize the design of a system.

Skill

Accessibility

First-Class experience

WCAG

Accessibility Architect

Web Content Accessibility Guidelines (WCAG) aim to improve web accessibility and user satisfaction by considering universal solutions and providing ARIA tailored solutions.

ADA

Section 503c

The Americans with Disabilities Act (ADA) protects people with disabilities from discrimination and advances web accessibility. It also requires Accessibility House to consider user interactions and preferences when creating tailored solutions..

Skill

Gamification

Making products dance

UI/UX

  • CSS
  • HTML
  • JS
  • SQL

Over a million lines coded.

Web Components

Codepen IO

Sometimes you have to prove it works.

Visit the code gallery

Skill

Solutions

Perfect results! That's old news.

PO

Product Owner

Leading the way from start to finish with scanners, mobile applications, and server side business flow, providing a single source of information to keep the product development team focused and efficient.

The "Accessibility House" Mortor!

Silicon_Hackers' Accessibility House

Accessibility House is a demonstration of WCAG first universal design, with "Easter egged" gamification hidden throughout the experience. This is an experiment in cognitive assumptions. Cognitive assumptions are explored by comparing the impact of different stimuli on user behavior and keeping users focused on following a desired user flow. You are evaluated by how many "Easter eggs" you are able to discover within the site. This calculates the impact of gamification interactions with the goal to keep users attention on following the intended user flow.

Site Map

Legal

™ Silicon_Hacker

™ Accessibility House

® All rights reserved

© 2023 SiliconHacker.com, Inc.



Accessibility House Style Guide

This is the style guide for Accessibility House styled controls.

Colors

Primary Colors

Name:

RGB:

HSL:

Name:

RGB:

HSL:

Name:

RGB:

HSL:

Name:

RGB:

HSL:

Backup Colors

Name:

RGB:

HSL:

Name:

RGB:

HSL:

Name:

RGB:

HSL:

Name:

RGB:

HSL:

Gray Scale Colors

Name:

RGB:

HSL:

Name:

RGB:

HSL:

Name:

RGB:

HSL:

Name:

RGB:

HSL:

Typography

Typeface

is used as our primary typeface and is used as an accent for headings and other special purposes.

Aa Bb Cc Dd 012345679

Aa Bb Cc Dd 012345679


Fonts

Primary font: Source Serif Pro, Georgia, Arial, sans-serif;

Primary font italic: Source Serif Pro, Georgia, Arial, sans-serif;

Primary font bold: Source Serif Pro, Georgia, Arial, sans-serif;

Secondary font: Verdana, Times, serif;

Secondary font italic: Verdana, Times, serif;

Secondary font bold: Verdana, Times, serif;

Script font: cursive;


Headings

H1

The quick brown fox jumps over a lazy dog

H2

Amazingly few discotheques provide jukeboxes

H3

A wizard’s job is to vex chumps quickly in fog

H4

Bright vixens jump; dozy fowl quack

H5

Jackdaws love my big sphinx of quartz

H6

Pack my box with five dozen liquor jugs

p

Painful zombies quickly watch a jinxed graveyard. Grumpy wizards make a toxic brew for the jovial queen.

/* ?? -20px */ .clamp12 { font-size: clamp(80%, 90% + 0.5vw, 90%); font-weight: 300; line-height: 1.2; letter-spacing: 1px; word-spacing: normal; } /* ??-20px */ .clamp13 { font-size: clamp(90%, 97% + 1.3vw, 105%); font-weight: 300; line-height: 1.3; letter-spacing: 1px; word-spacing: normal; } /* 14-20px */ .clamp14 { font-size: clamp(100%, 90% + 0.5vw, 110%); font-weight: 300; line-height: 1.2; letter-spacing: 1px; word-spacing: normal; } /* 17-22px */ .clamp17 { font-size: clamp(110%, 97% + 1.3vw, 120%); font-weight: 300; line-height: 1.4; letter-spacing: 0.5px; word-spacing: normal; } /* ??-22px */ .clamp19 { font-size: clamp(180%, 97% + 1.3vw, 200%); font-weight: 500; line-height: 1.4; letter-spacing: 0.5px; word-spacing: normal; }





Release Notes:

System Health: 98%

Some tablets are displaying off-centered.

December 2022

The previouse release hav been sunset: (add image?) hacker tornado (v1) business card (v2) we have begun the amazing vision of designer concept (add imge) to have real time updates, charts, user feedback. Single Landing Page

New Features—Refactored Experiences
Type Name Note
New New release (v3) Initial release of refactored "siliconhacker.com" as accessibility first design site.
  1. Vision
  2. Style Guild
  3. Responsive
  4. Silicon Hacker Web Componet Library
  • Vision
  • Style Guild
  • Responsive
  • Silicon Hacker Web Componet Gallery
New Light Dark Mode User configuration for light dark mode with looks at system preferences.
Refactor Responsive Views Mobile, Landscape, Tablet, Desktop, and Television
New favicon v1 Initial favicon using black and white SH
New Company Slider Business I have worked with over the decades.
Refactor Green Theme Highlight Using the classic silicon_hacker greens for text highlighting and other special effects.

January 2023

The astetic and layout have been established; it is time to in some content and pop.

New Features—Refactored Experiences
Type Name Note
New Full Screen Button Cards on the main body have a "full screen" button that is visible on focus.
Refactor Refined UI Elements Sofisicated accessibility for full screen mode and animations.
Refactor Event Buttons ARIA refinements labels and transistion labels
Refactor Favicon v2 Second icon using the Accessibility Houses' accessibility avatar.
New Animation Accessibility Houses' accessibility avatar "Top cane spin".
Refactor Company Slider Added (30) slides and polished keyboard experience.
Refactor Full Screen Mode Fixed quirks between responsive views.

Feburary 2023

The page is lacking a rounded experience, needs more user research.

New Features—Refactored Experiences
Type Name Note
New Animations Mode User configuration for light dark mode with looks at system preferences.
New Labels Mode User configuration for light dark mode with looks at system preferences.
Refactor Footer Updated business registrations and corporate taggings.
New Help Us Button Easter egg button
New Menu Button Full responsive mobile and tablet menu button transistions into desktop and television views.
Refactor Closures Help Us Button easter egg "double click" glitch fixed.
New Release Notes Page Published release history of feature pushes, refactors, and product backlog.
Refactor File System Split CSS and JS files into smaller files for organization with life cycle development.
New Style Guide Page Showcased Accessibility Houses' colors and fonts.
Refactor Font System Scrapped the almost every font to have it use the new responsive font system with the primary goal of improving legibility.

March 2023

Four user research sessions have provided an avalanche of feedback. The results have been getting organized and prioritized to Implementation.

New Features—Refactored Experiences
Type Name Note
New Release Notes Page Added ESC key keyboard support for closing the page.
Refactor Footer Removed Style Guide page, Help Us Button, and Curved text. Setup three grid area layout
New Animation Accessibility Houses' accessibility avatar "bounce".
New Profile Page Official profile page for Silicon Hacker
New Smart TV App Layout Wide (8) column layout to resemble landscape movie poster.
New Release Page Beautified the table ascetic with flat UI feel and row highlighting.
Refactor All view ports Dynamic testing to keep layout consistancy with the mix of various options and layouts.

Future Goals

I have enterprise level goals for this little design site. When this gets to the end of the road, you should will feel like your that dude in harry potter reading the newspaper.

Backlog of future goals
Type Name Note
New Cookies Mode Settings button to toggle cookie acceptance which will include local saved easter egss and ability to reset.
Refactor Company Slider Add card number system and refine card view.
New Database Connectivity Stand up database to collect all the product events to get posted into a real time dashboard.
New Mobile App Signup Flow Gamification experience that links with the cookie system
New SaaS Dashboard Expanded data visualizations with drill throughs and discovery experience.
New Wallpaper Gallery A wall of images that has random animated events for focus and pleasure.
New Search Structured data to enhance search engine optimization experince and ranking.
Refactor Hosting Repsolve siliconhacker.web.app to siliconhacker.com.
New Cart Flow Use transaction system to to check off list "charge users" for easter eggs found in page events.
New Privacy Page User "terms of use" agreement experience.
New 404 Page Bring tornado silicon hacker to the page not found experience.