More on Project 1
For the assignments in this class you have a choice of user interface toolkit that you wish to use. Good options are Swing for Java, fltk for C or C++, or wxWidgets for a c++ or Python. The limitation is that we need to be able to check your program on the CS department linux machines on the second floor of SEL.
Project 1 will give you a chance to program a small interface and get used to the UI toolkit of your choice before we proceed onto the main project in the course: Project 2.
Each person will work individually on this project. This project is NOT a team project.
It is expected that all of the code used in these programs will be written by you. You can use code from the web as examples and a guide to writing your code, but the code must be your own. We will be using computer software to compare people's programs and it is very good at finding similar programs.
Any code, images, icons, or other elements borrowed from others must be cited in the work and in the README file.
Now onto the project itself.
The iConditioner is a Computer controlled thermostat.
Thermostats to control central heating and cooling in a house or apartment used to look like this:
Now
programmable
digital ones are becoming more common with small b/w LCD screens and a
few physical buttons, and some even with touch-screens.
It is also possible now, and more likely in the future, that you will
be able to control your thermostat remotely and wirelessly from a
tablet-PC-like device. This device could be used within the apartment /
house or it could be taken with you to control the temperature at home
while you are on vacation somewhere else.
The
interface hardware:
The
user interface
Turning in Project 1
The project is due at the beginning of class on 2/7/06
Make sure your project works on the linux machines on the 2nd floor of SEL. You can develop this on whatever machine you prefer, but that is the platform that we will be testing on, so be sure that it compiles and runs there.
Be sure to have a README file that explains what your program does, and what it does not do so that while grading we know what to expect. I would suggest using an html-based readme file so you can include images in it.
We will be using the traditional CS turnin system. Projects are due by the beginning of class on the due-date so please be sure you have your program turned in before then. For more information on turnin you can do 'man turnin' on any of the CS machines, but basically if you have a directory called 422 containing your project you would go to the directory level above 422 and type:
turnin -c cs422 -p Project1 422
were the -c tells which course and -p tells which project. Turnin definitely works from bert.cs.uic.edu
Presenting Project 1
An important part of creating user interfaces is getting feedback and using it to improve your design. Given the class size, this can be a bit of a challenge. On 2/7 and 2/9, after the project has been turned in, we will have some group discussions and presentations about the solutions to Project 1.
On Tuesday 2/7 the class will break into 8 groups. Each group will compare notes on their solutions to the problem and come to an agreement on a single interface design. This design does not have to be implemented; it should be presented as a series of screen snapshots/mockups for the major functions.
Before Thursday's class each group should create a web page with the team members' names, the screen snapshots, and a description of how the interface will be used. The address of this page should be emailed to Andy before class begins on Thursday.
On Thursday 2/9 each of the 8 groups will give a 8 minute presentation on the combined interface that their group came up with, using their web page, showing the snapshots and giving a brief description of its functionality.
Chris Rick Felix Joe |
http://www.rickdogg.com/cs422/cs422.html |
Samuel Mandeep Dubi |
http://www.cs.uic.edu/~spro/ |
Arunan Marco Vijay |
http://arunan.50webs.com/cs422p1.html |
Brian Sana James B. |
http://www.amaze-inc.com/Brian/CS422/GroupProject1/GroupProject1.htm |
Bindu James J. Manisha |
http://www2.uic.edu/~mrajku2/cs422/proj1.htm |
Cristian Benjamin Cara |
http://home.earthlink.net/~dxvii/422/ |
Dat Darshan Greg |
www.sapne.net/datdarshangreg.html |
Satya Eric Bharath |
http://www.cs.uic.edu/~eho/cs422/project1/ |
Cristian Chris Ben |
||
Brian Marco Manisha |
||
Darshan Dubi James Vijay |
||
Mandeep Arunan Satya James |
||
Sana Joe Eric Dat |
||
Bharath Greg Rick Bindu |
and here is a shell script to get the current outside temperature using wget which is available for unix/linux asnd windows ...
#!/bin/sh
# uses wget: http://www.gnu.org/software/wget/wget.html
# cities: http://my.aol.com/weather
# Chicago: USIL0225
city="USIL0225"
wget -q -O toto.txt "http://my.aol.com/weather/index.psp?city=$city"
grep 'Current Temperature' toto.txt | awk '{print $3}'
/bin/rm -f toto.txt
More on Project 1
For the assignments in this class we will be using fltk to build the user interfaces. There are several good toolkits out there to build interfaces, fltk is nice because it is very cross-platform and allows you to make use of your previous experience with C / C++.
Project 1 will give you a chance to learn ftlk on a small assignment before we proceed onto the main project in the course: Project 2.
Each person will work individually on this project. This project is NOT a team project.
It is expected that all of the code used in these programs will be written by you. You can use code from the web as examples and a guide to writing your code, but the code must be your own. We will be using computer software to compare people's programs and it is very good at finding similar programs.
Any code, images, or other elements borrowed from others must be cited in the work and in the README file.
The main source of information on fltk is www.fltk.org
The current version of fltk is release candidate 6, however release candidate 5 seems to be more stable for what we are doing.
You can get release candidate 5 from: ftp://ftp.fltk.org/pub/fltk/1.1.0rc5/ and its available on the suns at /home2/fac2/ajohnson/fltk
If you prefer to use release candidate 6 then it is available from: ftp://ftp.fltk.org/pub/fltk/1.1.0rc6/ and its available on the suns at /home2/fac2/ajohnson/fltk6
Now onto the project itself.
Before we cantalk about project 1 we need to briefly talk about Project 2. Project 2 will involve using fltk to prototype an interface for a PDA. In this assignment you will create a simple shell that will handle the controls of the PDA and give you some experience with what fltk can do.
Most PDAs on the market follow a few simple patterns. I have chosen the basic Pocket PC pattern.
Your PDA should look more or less like this:
The PDA has the following controls:
The screen size is: 320 pixels tall by 240 pixels wide. The PDA in assignment 2 will be dedicated to a single task so you will be able to take over the entire screen and all of the buttons aside from the on/off switch.
The PDA has a speaker but no microphone.
The PDA has built-in wireless (whereas in these simulations you are reading files from the file-system you can assume the 'real' interface would be able to communicate with a central server)
For this first project we will assume that the PDA will be used in its 'traditional' configuration with a vertical screen and the buttons below the screen. For project 2a this assumption is relaxed and you can chose the orientation that the user sees - though you cant move any of the buttons or the scrollwheel. For project 2b this is relaxed even further and you can redesign the PDA.
For Project 1 you do not need to exactly duplicate the PDA that I created ... you can change the overall size and shape of the PDA slightly (but not the screen), and give it a colour or image that you like, the buttons dont have to be square and they can be moved around a bit, or have images placed on them. If in doubt, show me your proposed layout and I'll tell you if its OK or not.
In this assignment you need to write the code to set up the visual representation of the hand-held and handle all of the various buttons. This should give you some ideas of how to set up the interface for the second project. Note that if you with to use fluid, the fltk user interface designer, then that's OK ... though personally I thought it was easier to complete this project without using fluid.
When the PDA is turned on (the simulator application is run) it will display an introductory graphics screen (a gif file) and read in several data files:
- pictures.txt - a text file containing the filenames of images (maximum of 100) for the pda to display. All the images will be gif files. All will be 320 pixels tall by 240 pixels wide.
- index.html - a simple html file for the pda to display.
- survey.txt - a text file containing a list of short questions (maximum of 100) for a survey.
Samples of these files (and images) can be found below. Note that the final testing files will follow these same formats but will not be the same files.
index.html
survey.txt
pictures.txt
title.gif
nasa1.gif
nasa2.gif
nasa3.gif
nasa4.gif
nasa5.gif
The 4 main buttons will perform he following tasks:
far left - bring up the picture browser (using Fl_GIF_Image). The first picture from pictures.txt is displayed. Using the scroll-wheel the user can scroll through the various pictures, bringing each one onto the screen in turn.
left center - bring up the html browser (using Fl_Help_View). This will display the index.html file and allow the user to move through it using the scroll bars that will appear if needed on the screen. The user should also be able to scroll through the html file using the scroll-wheel.
right center - bring up the survey form with questions from survey.txt. On screen each question in the survey will have a check box (Fl_Check_Button) that the user can check (by clicking on it) or leave unchecked. The scroll wheel will be used to scroll through the questions. At the bottom there will be a 'submit' button which will print out the results of the survey (cout or fprintf is fine for this.) Note that the questions could be fairly long so you may need to reformat them to make sure all the text is visible on the screen.
right - extra credit - this one is available for you to come up with something creative making use of the joystick. Look through some of the other options in fltk and see what you can come up with.
Turning in Project 1
Make sure your project works on the Suns on the 2nd floor of SEL. You can develop this on whatever machine you prefer, but that is the platform that we will be testing on, so be sure that it compiles and runs there.
On the suns, fltk can be found in my directory /home2/fac2/ajohnson/fltk for release candidate 5 (preferred) and /home2/fac2/ajohnson/fltk6 (less preferred but newer)
Since the gcc compilers got updated at the end of August, so now you should compile with something like:
gcc -O3 -c
-I../fltk/ -I/usr/include -o project1.o
project1.cxx
gcc -O3 -o project1 project1.o -L. -L../fltk/lib -lfltk_forms -lfltk
-L/usr/openwin/lib -lm -lXext -lX11 -lfltk_images -lstdc++
you may also want to add in -ljpeg -lpng depending on what functions you use in your code. fl_register_images() seems to like to have those on the link line. ernie also seems to be a more stable machine to compile and link on. g++ works as well as gcc.
Be sure to have a README file that explains what your program does, and what it does not do so that while grading we know what to expect.
We will be using the traditional EECS/CS turnin system. Projects are due by the beginning of class on the due-date so please be sure you have your program turned in before then. For more information on turnin you can do 'man turnin' on any of the CS machines, but basically if you have a directory called 422 containing your project you would go to the directory level above 422 and type:
turnin -ccs422 -pProject1 422
were the -c tells which course and -p tells which project. Turnin has been turned on as of September 3rd.
last updated September 5, 2002