Reflection Assignment 2

Who I pretended it was for: The Mayor of the City of Chicago

What I did:
I created a separate sheet for the chart data. This keeps the main data clean for the person reading it.
I used query language to create three sets of data. Two of the sets had two lists which is why I call them a set.

My first query was: “select A,B order by B desc limit 5” followed by a “=SUM(Summary!B:B)-SUM(B2:B6)”

This takes the top five departments by total paid in salaries. The departments after that are listed as OTHER and their sum is calculated by taking the total sum of all departments and subtracting the top 5 departments. This data goes into a chart that allows the mayor to get a quick overview of where the money is going.

My second query was: “=QUERY(Summary!A:B,”select A,B where A’POLICE’ AND A’FIRE’ AND A’WATER MGMT’ AND A’AVIATION’ AND A’STREETS & SAN'”)”

This takes the rest of the departments and puts them all into a list. The where A’DEPARTMENT’ makes sure the top five departments aren’t included in the list. This data goes into a smaller chart that allows the mayor go into more detail of the OTHER section of the previous chart.

The next set of data was found using two countif functions and one countifs function to count the amount of people in a salary range. This data goes into a big chart by itself. This allows the mayor to see how many people are in salary range and where maybe someone could get a pay raise.

My third query was: “select A,F order by F desc limit 5” followed by a “=SUM(Summary!F:F)-SUM(J2:J6)”

This is like the first query but this time it finds the top five departments by the number of employees. The second part does the same as the first query set’s second part does. This data also goes into a chart so the mayor can see which departments may need to downsize.

The fourth query was: “select A,F where A’POLICE’ AND A’FIRE’ AND A’WATER MGMT’ AND A’STREETS & SAN’ AND A’OEMC'”

This does essentially the same as the second query but once again with employee number rather than salaries.

What I would do differently:
I would probably use a data set with less items. This data set wasn’t good for charts or at least pretty charts.

I might make the Other chart even more subdivided.

Website Behavior

URL: Mod Cloth
modcloth screen shot

Structure: Solid structure for a shopping site. It’s organized like most so its easy to get around
Content: I mean I love the clothes so I definitely like the content
Design: The design follows the trend of panels and long scrolling pages. The fonts are easy to read and the colors are pleasant.
Behavior: The behavior is typical for the type of website. Though the carolouse does cause some lag(at least on my chromebook)

Usability Tests

Observations: Some of the tests were a little awkwardly worded. I think my test was a little skewed because I observed some tests before going into mine. I was more prepared than the others for going into the tests.

Why it’s important.

As a designer and a programmer, your view on how easy to find something is skewed because you put it there in the first place. It’s also important to see how the user thinks.

Reflection on Google Sheets

I used formulas that helped sort the data and give more information. The formulas were mostly conditional, I mainly only wanted data about a specific department. I created two formulas, MAXIF and MINIF. These work like the main MAX and MIN functions but I am able to give a condition, in this case the department name. These formulas are hard coded so they can only be used with this spreadsheet right now.

List of Formulas used:

  • =UNIQUE, to make the department list
  • =SORT, to make sure the departments are in alphabetical order
  • =SUMIF, for summing the total for each department
  • =SUM, for summing the total how much the city spends in salaries overall
  • =AVERAGEIF, for finding the average salary in each department
  • =AVERAGE, for finding the average salary in the city
  • =MAXIF, to find the top salary in each department
  • =MAX, to find the top salary in the city
  • =MINIF, to find the lowest salary in each department
  • =MIN, to find the lowest salary in the city
  • =COUNTIF, to find the number of employees in each department
  • =COUNT, to find the total number of employees
  • =COUNTUNIQUE, to find the number of job titles in each department
  • =FILTER, to filter the content so it only gets the specific department

Sorting and calculating data by department helps someone maybe in Fiance get an overall view at what the city spends on its workers. It can also see which departments are spending the most money or which ones use the least. It also lets someone see how many employees are each department.

Web Service: Codepen

Codepen is one of my favorite webservices(Is this a webservice? I’m counting it as one).

Pros:
Accessible from anywhere. I can use my Chromebook to work on something and then go view it on a bigger screen in my laptop.

Easy to get started. I can experiment with things like Sass and Less without having to install anything on my computer.

Codepen has an interesting community. The community is fairly active and they have ‘picked pens’ which lets me see really awesome things.

Forking is really amazing. Part of learning to code is experimenting with working code to see what changes. Codepen allows you to fork someone’s else code and play with it.

Cons:
You can’t really go deep.Most of the stuff Codepen is for front end development.

It’s hard to get the base file. Well, not hard, but it isn’t easy to get the actual html/css/javascript document

Codepen helps my workflow by letting me experiment and test things out before writing a giant html file.It also has me type less code because it preloads most of that.

Top 5 New Google Tricks

1. Google Scholar – This isn’t in the Practice things, but I’ve found this to be one of the most useful tools ever. Research Papers are so much easier when you’ve got Google on your side.

2. Word Order – I know this seems like a throwaway answer but I seriously was not aware that word order mattered in your search. I only knew that the actual words mattered, didn’t think about the order at all.

3. Combining Operators – I didn’t know that you could do two operators together. Like -site:gov. That really helps with narrowing stuff down.

3. WHOIS – You use it to find connections between companies. It can be used to verify sources of information.

4. Time Filter – No idea you could filter by time. Pretty cool. I can’t think of a time I’d use it but still fairly interesting.

5. The Define Operator – Actually useful because sometimes just searching the word brings up things that are not the definition. This is just a faster way than putting word site:dictionary.com.

Let’s get Sassy

I have now discovered the best thing to happen to CSS coding. Sass. Sass is a CSS Preprocessor and basically turns CSS into a way to code like it’s Java or other higher level languages.

Features: Variables(Omg thank God), Mixins(Basically a function), For Loops(You can have lists! I’m so happy), If statements (Conditional statements are amazing. I wonder if you can nest those), Easy nesting and so on and so forth.

Here is the Sass homepage if you want to check it out

CSS Color Wheel

This is a simple CSS Color Wheel. I made an outer container to hold the actual wheel and the back wheel. The back wheel is for the shadow because I didn’t want it to move. The actual wheel actually has a simple animation to spin. Inside the wheel div, smaller “color squares”(I know they are circles but they were going to be squares and I didn’t want to change every name in the code afterwards) are placed using margins. It was a simple program that was more tedious than hard.

Here’s the actual pen