Today, offering a standard solution is not enough. To make it worth the investment, you need the right customized solution for your web based business. You need the right mix of web strategy and development expertise. You need a specialist or a team that has a solid experience in building web applications using multiple technologies.

zElement is a San Francisco Bay Area based web strategy and development company that has earned respect from succesfully serving big and small clients. We have the technical expertise and 20+ years of experience in building modern web applications with performance, security and scalability in mind. Our work is focused on delivering customized web applications. We take pride in keeping our skills fresh by staying on top of the latest technologies, industry trends and practices.

• 20+ years of solid web strategy and development experience
• We work with the latest technologies to deliver performant, secure and scalable web applications
• Clear professional communications and honest advise
• Quality code delivered on time
• References can be obtained

Tech Stack: JavaScript, Web Components, LitElement, Angular, React, Redux, Vue.js, Backbone, Knockout, TypeScript, Google Closure, RxJS, NGRX, Immutable.js, d3.js, ES6, Webpack, Handlebars, jQuery, Web Components, Paper, Bootstrap, Material Design, Semantic UI, JSON, XML, HTML5, CSS3, SASS, GraphQL, APIs, AJAX, Socket.IO, Node.js, PHP, Python, JSP, XSS, Spring, Struts, XSLT, Java, Rails, RequireJS, Grunt, Gulp, Bower, Jenkins, MongoDB, mySQL, Responsive Design, Maven, Karma, Jasmin, Git, Git Gerrit, Docker.

PROJECTS

Cred, Inc.

Re-architected Front End based on the tech stack: React, Redux, Node.js, Webpack, JavaScript. Implemented: JWT token based secure auth for the app, 2FA, JavaScript SDK, improved and streamlined performance, optimized and refactored code, migration to new version of APIs, support of mobile and web.

Tech Stack:

• React, Redux, JavaScript, Webpack, Node.js, Node.js APIs, CSS, HTML5

Google: AI

Google AI image recognition web app.

Tech Stack:

• Polymer, LitElement, Closure, JavaScript, Redux, Web Components, Python backend

Google: BugDashboard

Google’s internal bugt racking tool is expanding into a larger, centralized application for project overall tracking. A number of highly desirable features needed to be added in order to take the step towards that objective. Dynamic table resizing and adding a custom link would be some of many major enhancements.

Tech Stack:

Angular, TypeScript (strict mode), JavaScript, RxJS, NGRX, Immutable.js, Material Design, Proto Buffer

Walmart.com: migration of API Services

Walmart Labs updgrated the API Services that caused various high profile bugs. Here’s one of the issues that covers work on the server side area prior page render. The data set no longer returns the same structure and properties, disabling various feature compoments and resulting in page errors.

Tech Stack:

React.js, Redux, ES6, Node.js, Stylus, Webpack, JavaScript

MyFitment: iFrame Selector Project

This widget can be embedded into any 3rd party website by just appending a one line of code. The secure communication is handled via iframe and window.postMessage() mechanism, as the actual app is hosted somewhere else. This widget can be used for easy to integrate chat clients, search boxes and in many other cases. In this specific project, the widget is used to search auto parts between 2 independent domains.

Tech Stack:

React.js, VueJS, ES6, Webpack, Node.js, JavaScript, HTML5, SCSS, Foundation

Macys.com: Component Browser

The internal tool is built to aid company’s development teams with live information and status of updates for app components developed within the organization. It queries private GitLab repos, checks and displays changes such as new, removed or modified packages, dependencies. Users can search for projects or navigate the tree. The beckend in Node.js and MongoDB is connected to the deployment system and with every Jenkin’s build a script would kick off a task to push project meta data to the tool’s APIs. The tool’s backend would deconstruct the data, create and organize a record in the database.

Tech Stack:

React.js, Vue.js, JavaScript, Node.js, ES6, Webpack, MongoDB, Redis, Foundation

Stanford VPTL: HST project

Stanford VPTL group had an objective to release an educational web application that allows professors to create and manage exams. I was involved in a complete UI Architecture and development, from project’s inception to the end. The application is focused on complex user interactions with the web interface and RESTful API internal and external services. Features:

• Authenticate user with roles
• Create new exams
• Load and edit exisisting exams
• Perform searches with filtering and sorting
• Upload and Remove media files
• Smart auto scroll based on states
• Auto save documents in Edit mode
• Validate data
• Supports Security
• Built with Performance in mind
• Supports Responsive Design
• Supports Assesibility

Tech Stack:

Angular, Require.js, JavaScript, Angular Bootstrap UI, Java RESTful backend, Data Structures, HTML5, CSS2, SQL, Maven, Jenkins

Teradata: App Center 2.0

The project involved building the next version of AppCenter dashboard with up-to-date UI and UX, better performance and richer features. Integrated Login Auth, LDAP Settings, JSON validation, Stepper and other modules.

Tech Stack:

Angular 2, JavaScript, EC5, Angular Material Design, Angular-Formly: Material Templates, Data Structures, RESTful API communications, Java, Node.js, Docker Containers

skyPatrol: Pebble Smartwatch App

skyPatrol displays real-time information of airplanes in the sky, based on user location.

The app is built for smart watch Pebble. When user selects a button to load the info, a request to the API end point is made. The response is a JSON based object that returns data and renders on the screen of the watch.

Tech Stack:

PHP API, JSON, JavaScript, Pebble.js, Pebble location, Pebble Ajax

Cisco Intercloud: AMP (Account Management Portal)

This portal was built to allow CISCO Cloud users to have a consistent flow and seamless experience of interacting with various external CISCO systems.

The project involved a complete UI Architecture of the large scale application, integration with external and internal system components, RESTful API, security, authentication, SSO support, permissions, cross system communication, performance optimization, responsive design and more.

Tech Stack:

AngularJS, Require.js, Data Structures, Java, Node.js, REST APIs, CSS3, Bootstrap, JavaScript, jQuery, r.js, HTML5, redhat, Maven, Jenkins

Monster Cable Products: Mobile Site

Converted and refactored site’s code to support mobile viewing experience and functionality. The site dynamically adjusts to various mobile devices, including iPhone, iPad and Android.

Enhanced functionality and layout of various components including navigation, supporting pages navigation, product main pages, main Responsive Design for main story page (http://www.monsterproducts.com/head-monster-story).

Tech Stack:

CSS3 with animations and media queries, JavaScript, jQuery plug-ins, Bootstrap Mobile, .Net

e8Security: Data Visualization

Botnet Cluster Visualization Prototype is a proof of concept for visualizing security intelegence data. The graph communicates a scenario where a source IP/domain sends data to destination IP/domain at a particular time period. The feature is built around asynchronous client-server communications utilizing RESful API services, data transformation and custom formatting to feed and render the graph, as well as real-time rich interactions.

Tech Stack:

d3.js, Data Structures, Node.js, AngularJS, Require.js, Handlebars, Javascript, jQuery.js, CSS, HTML5, Bootstrap

Norse Corp: Cyber Security Project

Conceptualized, wire-framed and built Dashboard for Cyber Security Network Management with Data Visualizing. Socket IO interface to pipe and render network traffic and threat data. Built Link Attribution widget in d3.js to interact and retrieve linking data sets.

Tech Stack:

d3.js, Data Structuresm, Node.js, Backbone.js, Require.js, Handlebars, Javascript, jQuery.js, CSS, HTML5, Bootstrap

AT&T: AIR BI Tool

AT&T’s project AIR entailed building a Business Intelegence Tool for advertisement reporting and analytics. The tool pulled daily Big Data reports (TV, Cell phone, web), rendering in dynamic Data Visualization modules and thus allowing to interact and make scientific inferences, forecasts and computations.

Tech Stack:

d3.js, JavaScript, jQuery, Data Structures, Backbone.js with Require.js, Node.js, Phantom.js, HTML5, CSS3

Walmart: Vudu, Pharmacy projects

Walmart’s Vudu Video Service required client-side code optimization to enhance performance and transition from YUI to jQuery library support.

Pharmacy project’s objective was to redesign the module, enhance user experience and support new features. Asynchronous client-server content exhange leveraged via JavaScript, jQuery and JSON as well as re-architecture of global components have improved overall site performance and thus user experience.

Tech Stack:

YUI, jQuery, JavaScript, Data Structures, HTML5, CSS3

eBay: shopping.com projects

“Guides” feature, composed of individual widgets, allowed users to create, edit and publish their own customized rich content pages to the web and be searchable by search engines. The widgets were: “Product” with Ajax + JSON driven “Mini Search” component, “Image Upload”, “WZWG Text Editor”, “Embeded Video Upload”. Implemented lazy loading, dynamic DOM manipulation, drag and drop, Ajax-based pagination, dynamic interactions and efficient Object Oriented JavaScript code. “Whislist” was introduced as one of the first e-commerce widgets that became popular with other e-commerce sites.

Tech Stack:

JavaScript, jQuery, jQuery plug-ins, Data Structures, HTML5, CSS3

BARCLAYS GLOBAL INVESTORS: Tools, Internationalization Mexico

Project “Tools” was released in Q-3 of 2009. The objective was to introduce a new, easy and highly interactive experience for users to preview their financial analysis data summary.

Lazy loading concept allowed smart and fast on-demand data loading, thus allowing significantly faster performance on the Front End. Data Visualization allowed dynamic rendering and interaction of charts. Implemented system internationalization to serve Latin America.

Tech Stack:

JavaScript, jQplot.js, HTML, CSS3, JSP, JSTL, XML

Macy’s

A highly desired feature, “Find It In Store”, was launched on macy’s site to provide users with convenient experience of checking a product’s in-store availability in a near-by macy’s store location. It enabled users with an easy, fun and convenient online shopping experience by allowing them in real-time to check whether an item is available, draw directions to the closest macy’s store and print out the map and the barcode.

YUI libraries, MapQuest API intergration, Ajax with JSON formated data, CSS were the main technologies and implementations used to develop this wizard-like flow.

Tech Stack:

YUI, JavaScript, MapQuest API, XML, HTML, CSS3

Previous Work:

Clients: