James Grey Website Redesign (Summer 2012)

Posted on August 18, 2012 by Albert Nera

It was back in 2010 that the I developed the official website for musician/songwriter James Grey. The site was intended to be iweb compatible and hosted under the client’s Mobile Me account. However, as Apple users know, in the summer 2012 Apple planned to to drop Mobile Me and transition customers to there new iCloud Service. With this transition the ability to host an iWeb website was also completely dropped forcing long time users to find alternatives.

So in the Spring of 2012 I was contacted by James Grey asking if i could assist in the transitioning process of his site. The site’s transition proved to be a bit more challenging than expected and during the process James Grey asked if it were possible to take advantage of this transition opportunity to start fresh and perhaps redesign the website. So with that request, the task of developing the third version of the site began.

The new site would in the end include:

HTML and PHP based design
Incorporates widget features powered by ReverbNation such as the ability to sign-up to a newsletter or see locations of upcoming shows.
Social media links in the header and footer.
More access to multimedia including James Grey’s songs and music videos through links and embedded media in the form of Reverbnation HTML5 Music player and Youtube videos.

Visit jamesgrey.com (redesigned)

A Joanna Leack’s Website (Summer 2012)

Posted on August 17, 2012 by Albert Nera

Joanna Leack Website – Home page

Joanna Leack is a talented artist from Murrieta, California with an ever growing portfolio of remarkable work ranging in themes from landscapes to abstracts and as with all artists, Joanna wanted to introduce her work to as many people as possible. One of the best ways to do so was to establish a website to showcase samples of her paintings and provide links or info regarding upcoming shows or ways to purchase her artwork.

As a college friend and fellow classmate Joanna Leack was familiar with my work and asked if I could help her get a site up and running. After Joanna obtained her personal domain I immediately began to conceive of a design based on her criteria and samples she provided which including a fellow artist’s personal website and a web design project Joanna herself had worked on in the past as a class project.

After some back and forth discussion with Joanna, I was able to get a sense of what she was looking for from a design. Basically the site would serve the purpose of an online portfolio whose focus would be on displaying images and possibly some descriptions for each of her art pieces she’s created up to the present. With some knowledge in HTML and CSS coding, Joanna felt that she wanted basically a frame/template with a simple design that she can then take over and modify it herself over time.

After a week and half of development a design was developed, approved and a site developed which included of the following features:

An HTML and CSS based website with 8 pages including the home page and a contact page as well as six display pages for each of the art styles.
The layout would consist of a two column design where the left column would be much wider than the right and used to display larger images, while the much thinner right column would hold either thumbnails or descriptive text.
The design would be relatively minimalistic consisting of a grey background with some added contrasting color in the right column and in the banner for the site.

Visit Joanna Leack Website Project

Math Tutor 1.0 (Spring 2011)

Posted on August 16, 2012 by Albert Nera

Math Tutor 1.0 Application

Software and hardware go hand in hand, however for consumers today it is the GUI (Graphical User Interface) based software that matters most. The design and functionality of the user interface should reflect certain characteristics such as clutter free design, attractive graphics and quick response time. With this in mind I moved forward with developing a Windows executable program as part of a semester project for an Intro to Programming class The name of the program is Math Tutor 1.0 and it’s intended purpose is to provide young students grades 1- 4 with a quick and simple means of practicing the fundamental mathematical operations of Addition, Subtraction, Multiplication and Division.

The Math Tutor 1.0 program was developed using the Windows Visual Basic developer suite and uses a form interface with a clean design that relies on input boxes for keyboard input and large on screen buttons to execute the program’s functions. The program is designed as a demonstration of basic programing and development of applications so the program is relatively simple.Consequently the system requirements are quite low and can run on computers ranging from Pentium III 256MB RAM machines to current dual-core or higher processors with 4GB or more RAM.

Despite the program’s simplicity the concept behind the program can still be a helpful tool for parents and educators trying to get the younger digital age generation of today to strengthen their math skills The design of the program itself can be further expanded to provide an even better user experience, however for the time being there are no concrete plans to develop a 2.0 version or even a slightly updated 1.5 version.

Yet feel free to download the program and play with it. Details on minimal system requirements are outlined below.

Download Math Tutor 1.0

Minimal System Requirement:

Windows 2000/XP, Pentium III or higher, 256MB RAM or higher.

(Note: These requirements are a result of testing. Lower or higher requirements may or may not provide solid compatibility.)

Arduino – My Platform of Choice

Posted on August 8, 2012 by Albert Nera

Arduino Uno R3 – www.arduino.cc

The Arduino is an inexpensive and versatile open-source micro-controller based on the Atmel AVR processor. This Italian made micro-controller was developed in 2005 by the Olivetti computer company as an affordable prototyping platform for students to develop projects. Today the Arduino is available in different variations from vendors such as Amazon or Adafruit and has helped revolutionized not only the ability of students to develop impressive projects but also helped professionals test out concepts, perhaps even build real-world systems around the processor itself.

My introduction to the Arduino platform began in the Fall of 2011 and has become one of my key tools for developing personal projects and expanding my hand-on skills working with components like sensors and motors. The most remarkable aspect of the Arduino is how easy it is to program the micro-controller to do execute the exact tasks you (the project designer) envision. This all thanks to three key characteristics of the Arduino.

First of all the Arduino was developed with the ability to be programmed using a C based language and the easy to use environment software is available for free download from the official Arduino website. So there is no need to purchase or download third party IDE or compilers compatible with the Arduino platform.

Second, the Arduino is available in different forms with different interface connections (USB, Ethernet and COM) designed for the specific task associated with the particular Arduino model.

Third, adapter boards called shields are also available for Arduino and can be connected on top of an Arduino board, particularly the popular Arduino Uno. The different shields available can provide expanded interface capabilities for programming and control of components through addition of connection types and extra pins. So with the purchase of one Arduino board multiple types of projects can be constructed with out the need of extra specialized boards.

As you explore further into my engineering projects you will likely see the Arduino come up a lot. Hopefully this post will provide a good introduction to the platform I often use for my own projects.

James Grey Official Website (Spring 2010)

Posted on July 29, 2012 by Albert Nera

Music Page for jamesgrey.com

In 2010 musician and Songwriter, James Grey sent out a request to up and coming webdesign students to gain real-world experience and add to there portfolio the project of designing and developing his official website, jamesgrey.com. I took on the project as a solo designer/developer in late spring of that year and developed what would become the totally redesigned second version of the client’s website.

The website jamesgrey.com had already been around as an independently created and managed website for some time. However it was felt by James Grey that his site needed a whole new look to it and wanted someone who could spend more time designing and building it into a site that had more appeal but also could continue to be independently managed.

Initially the concept for project consisted of a mostly HTML/CSS website with some bits of flash and javascript. The design was to be evaluated not only by the client but also as a final class project meaning that it had to incorporate a few mandatory features. Personally meeting with the client to discuss and share different design concepts, a minimalist approach was ultimately chosen for the final design.

However, the client required that the website be capable of being edited using iWeb and uploaded to the client’s Mobile-Me account. Not all the features required for the final project would be needed by the client and by the end of the project the site had been split into two slightly different versions. One version would be judged as a final project and the other would be the client’s iWeb/Mobile-Me version. In the summer of that year the site officially went online and offered visitors with a fresh new look

The design included:

An eight page website with an overall minimalist design.
Plain white background with “splashes” of bright color
Integrated high quality studio photos of James Grey
A discography showcasing the a list of albums along with brief descriptions provided by James Grey and purchase links to iTunes and CD Baby.

Certain features like a ReverbNation powered song playlist and text content for news and biographical information were directly transferred over but incorporated in a new way.

Since its upload the site continued to be managed without problems, but in 2012, Apple planned to eliminate it’s Mobile-Me web-hosting services forcing clients to search for alternative options. Consequently, I was contacted by James Grey regarding this issue. A new web-host was found and the transitioning process began. Unfortunately, issues were encountered regarding the display of certain files after being transferred over. Simultaneously it was suggested that given the issues encountered, rather than having me create fixes within the code, there was now an opportunity for redesigning of the website to include new features.

Visit jamesgrey Website (Version 2.5 Design - last version)

Arroyo Verdugo (Spring 2010)

Posted on June 29, 2012 by Albert Nera

The Arroyo Verdugo website was developed as part of a demonstration project for a web design class. The goal of the project was to promote a local city or region (Arroyo Verdugo Region, Calif.) through a website that demonstrated the use of fundamental techniques related to XHTML and CSS while at the same time complying with W3C standards.

The entire project was developed over a period of six weeks. In that time the project went through the different design phases including brainstorming ideas, creating a concept design, designing a layout and development plan, generating the content and building the site and finally testing for cross-browser compatibility and W3C standards.

The final design for the project contained the following characteristics:

Developed using HTML and CSS code
Complied with W3C XHTML and CSS Standards. Two compatibility check buttons were included in the footer allowing users to verify this fact.
Consisted of a Home page (index page ) and 4 additional pages (Entertainment, Food, Lodging and Transportation)
Each page provided brief listings of locations or events related to the subject matter of the page.
Contained a PHP based contact form on the home page.
Images used were a combination of personal snapshots and online images. Background graphics were created in Adobe Photoshop and the site was developed in Adobe Dreamweaver.

Visit the Arroyo Verdugo Website Project

Scalenet E-Store Project (Fall 2009)

Posted on June 28, 2012 by Albert Nera

The Scalenet E-Store was one of my earliest full website projects. This project intended to showcase our understanding of basic topics covered as part of my Web Design 1 course. The website used html and css which integrates customized graphics, colors and fonts to create a more appealing e-store website that sells personal / office computers and accessories.

The final website included the following characteristics:

Pure HTML and CSS based.
Home-page and six additional pages
Custom banner, graphics and demo ads

Visit the Scalenet E-Store Website Project