Wireframes & Physical Sketch

[keidyalmonte]

The Physical Sketch and Wireframes are designed to follow the Personas we created to design an interface that will be designated to interact with our specific users. The physical sketch is a rough drawing on paper to be resembled in the Wireframes interface.

[keidyalmonte]

Physical Sketch

The physical sketch was created following the template of personas. The personas heavily impacted the way the Plant Hub was imagined to be by incorporating new ideas and new features into the design. One of the features that were newly incorporated was the use of a help button, instead of a select button.

The sketch below includes an LCD display to display the features measured, along with an "ON" button, "OFF" button, "HELP" button, and "LEFT" and "RIGHT" buttons. The "LEFT" and "RIGHT" buttons switch through screens to display the readings. The "HELP" button displays what each button does and how you can use them. The "ON" button turns on the display and also goes back to the welcome page if it was already on. The "OFF" button turns the Plant Hub off.

[keidyalmonte]

Wireframes The Wireframes interaction heavily transfers all of the details written in the physical sketch to bring the sketch to life. For my wireframes, I first started off with a physical design, which is very simple because the Plant Hub mainly composes of displaying the different features on an LCD Display. The physical design also includes suggestions I gathered from reviewing my personas. Each persona made a change to my design direction.

Physical Design

The LCD Display within the physical design is made to first display a welcome page, in which users are encouraged to use the buttons to the side of the display to switch between screens. The LCD display is not very big in size and cannot display much information, which is what I kept in mind while adding features.

Welcome Page

The Welcome Page only consists of a text that encourages the user to switch between screens to view the features' level readings.

Select Readings

The Select Readings screen, if the screen was a touch screen, would in theory allow the user to click which reading they wanted to jump to. For now, the select readings screen only displays the different types of readings and lists the order in which they are displayed.

Light Level Readings

The Light Level Readings screen presents the user with the current light level and the previous light level for reference by using the photoresistor to measure light. This allows the user to see if there is any difference in the space that they have created for their plant.

Humidity Level Readings

The Humidity Level Readings screen presents the user with the current humidity level and the previous humidity level for reference by using the DHT-11 humidity sensor. This allows the user to see if there is any difference in the space that they have created for their plant.

Temperature Level Readings

The Temperature Level Readings screen presents the user with the current temperature level and the previous temperature level for reference by using the DHT-11 humidity sensor to measure temperature. This allows the user to see if there is any difference in temperature values from then to now.

Soil Moisture Level Readings

The Soil Moisture Level Readings screen presents the user with the current moisture level and the previous moisture level for reference by using the STEMMA Soil Sensor. This allows the user to see if there is any difference in moisture values in the soil to allow for the user to be consistent.

Help Page

The Help Page allows for users to become comfortable with the interface by providing explanations to what each button does and how they can manage each screen.

The OFF button displays a blank screen.