• We are STAs
    • Abriella Corker
    • Angie Huang
    • Athena Zeng
    • Bridget Kessler
    • Cristina Villarreal Núñez
    • De’sha Bass-McClellan
    • Ingrid Alberding
    • Jake Engelberg
    • Megan Fletcher
    • Miguel Yapur
    • Mounika Tadanki
    • Poonum Mehta
    • Sheryl Long
    • Thuy Nguyen
  • We were STAs
  • STA Presentation
    • STA Presentation 2017
    • STA Presentation 2016
  • Testimonials
  • Resources
  • Home

STA Blog

Chatter: Branding/Logo Update

January 4, 2021 By Cristina Villarreal Núñez

Chatter: Branding/Logo Update

Happy new year!!! 🎉 🗓

2020 was… something… But it did give me the chance to start working here, so that’s undoubtedly something I’m grateful for! Nonetheless, I do hope 2021 is easier on all of us…

Anyhow, here’s an update on the Piazza Replacement Saga.

 

After Phase 2: starting my own logo drafts, we concluded that Draft 4 [see in previous post ] was my final draft and the one that got presented to the Chatter team along with 4 more options created by some of my STA peers. Well, as it turns out the Chatter team picked that one as the official direction for the logo… yeeey!

 

But the branding and logo were not yet finalized. There were refinements to be taken care of before finalizing anything. Moreover, the main concerns we kept in mind for the refinements were:

1.  Circle vs no backdrop circle

2. Eye vs no eye

And the subsequent issues on size, spacing, and placement.

 

The journey on deciding these changes was like so: first I was asked to make 4 new drafts for the refinements to tackle points 1 and 2. One with no circle and no eye, one with no circle but with eye, one with a circle and an eye, and one with a circle but no eye. Those versions looked as follows:

From there, we decided to focus on version 2.2. But there were definitively things to work on regarding the general spacing between the shapes, the size of both the eye and the backdrop circle, as well as the placement of the eye. The next batch of refinements looked as follows:

 

Once comments were made on the spacing between shapes and the size of the backdrop circle, issues concerning the eye size and placement remained. So I adjusted the size of the eye to the suggested size, and made the following three versions versions to decide on the placement:

 

Afterwards, I had a brief meeting with our design coordinator Maddy to make some further adjustments together. The main modifications we did were to rotate the shape of the head counterclockwise in order to preserve the “reaching” feeling we want the squirrel to embody to symbolize “reaching out to someone” or “reaching for knowledge” considering that’s part of Chatter’s purpose. After changing that it was easier to decide the placement for the eye.

 

Furthermore, the following is the current version of the Chatter logo (temporarily finalized but still subject to change if suggested/requested by the Chatter team).

 

Finally, I was also asked to suggest some more fonts for the wordmark in order to match the Chatter’s brand personality. If interested, in the previous post you can see my original font suggestions. The following were my new suggestions:

Filed Under: Fall 2020 | Spring 2021

Chatter

December 31, 2020 By Thuy H Nguyen

Chatter

I’ve been working on Chatter with the project managers, Chris, Maddy, and Abriella. It’s been really fun so far. I get to learn a little bit of Vue and did a lot of front-end stuff to implement Abriella’s design. Here are my progress for this week. Although it’s a holiday week, I’m really glad I’ve chosen to work this week, I’ve learned a lot and the work was really fun and exciting!

Today is also the last day of 2020! So much has happened in 2020, and I’d say that overall I’m proud of myself of what I’ve accomplished this year:

Learned React / React Native

Transferred to a major that I enjoy (so far . . . :p)

Learned how to create responsive web designs

Found more classical music to enjoy

Designed classical composers tote bags for a Charity

Learned Liszt’s Sonetto del Petrarca No. 47

Got more flexible in yoga

etc. etc.

Here’s a piece of music to close out 2020. Kreisleriana is one of those pieces that is very Schumannesque. The piece is supposedly the visualization of E. T. A. Hoffmann’s eccentric conductor Kreisler. It also features a lot of contrapunctal, dramatic, and stormy passages. The piece also reflects Schumann’s (supposedly) schizophrenic episodes featuring Eusebius and Florestan.

This rendition of Kreisleriana is performed by the legendary Martha Argerich.

Filed Under: Fall 2020 | Spring 2021

CHATTER

December 22, 2020 By Abriella Corker

CHATTER UI/UX

 

 

Project: Chatter, a replacement to Piazza.
Client /Prof: College of Liberal Arts at UT Austin
Completion status: Started December 1, 2020
Staff guidance: Maddy Kaniewski
STA team members: Thuy Nguyen
Description/plans: COLA is looking for an alternative to the messaging application Piazza used on canvas. The LAITS team has been working with Thuy and I to come up with the user experience and interface of the new application.
To be completed: Before Jan 21, 2021

 

 

These are the initial sketches of the UI:

I started off by looking at case studies on the redesigning of Piazza and drew from their top tips on the UX to inform how I should wireframe my own replacement version. For the most part, the main layout stayed the same in the final version. Chris also has a one-pager of 10 must-haves for a minimum viable product and I drew form that as well.

This is the high fidelity layout done in Figma. No color yet. Still exploring button appearances and placement:

Here the post a topic button is different on every frame as well as what the endorsed comment symbol was going to look like. We ended up going with a “+” post topic and a badge in the end after talking during our meeting. We were still unsure as to how the reply to a comment button will work in its effective communication to users. That may still need to be resolved after a to b testing.

These are the different color palettes I explored before settling on a UT palette:

Since this messaging system will be its own page I was allowed to play around with some unconventional color palettes. I tried a UT version anyway incase we place that inside the actual canvas page. It ended up being the favorite so from there I messed around with color placements keeping in mind how colors translate importance to primary and secondary buttons. I then placed each color option I did into a colorblindness simulator to make sure that the hierarchy of color still remained across all types of color blindness. https://www.color-blindness.com/coblis-color-blindness-simulator/

Below are images of the final desktop version:

This is how the final look came out. The logo has already been decided but is in the final stages of refinement which is why it isn’t depicted yet.

Below are the final mobile versions for tablets and phones laid out by Thuy and colored by myself:

Thuy went ahead and laid out the mobile version while I worked on coloring. Once her and Chris talked over what they liked best I went in and added coloring to this as well with a few minor spacing adjustments as well.

Filed Under: Fall 2020 | Spring 2021

ids

December 22, 2020 By Ingrid Alberding

here’s a few IDs I did in this short work week :^)

 

Filed Under: Fall 2020 | Spring 2021, We are STAs

Anti-Racism Banner

December 22, 2020 By Abriella Corker

Anti-Racism Banner

 

Project: Anti-Racism History Department “Overview” Banner
Client /Prof: Tiana Wilson, Graduate Assistant
Completion status: Started December 21, 2020
Staff guidance: Valerie Tran
STA team members: Abriella Corker
Description/plans: This webpage that they’re creating is part of a larger project that focuses on the Anti-Racism Initiative. This initiative was created as a result of this year’s re-rise of the BLM movement. They want the webpages to be a resource for POC grad students. The webpages they need will be created and implemented by their own team, but they are in need of assistance in designing two banners for the tabs for their webpage.

To be completed: January 21, 2020

 

Above are my first two sketches of the classroom banner that I made off of a reference photo provided. One includes and instructor the other is just the raised hands of students. Then below I picked this warm color palette with two bright accent colors of red and cream.

Here is how the final draft came out. I combined the two sketches to make the banner feel more full and fun to look at.

Filed Under: Fall 2020 | Spring 2021

Winter Work- Study Tips Animation

December 22, 2020 By Angie Huang

Winter Work- Study Tips Animation

It has admittedly been forever since I’ve updated my blog- like usual of me :’) I need to be more proactive about posting progress, instead of completion as I begin to take on bigger, more time-consuming projects. Here is a look into how I developed the lofi scene for the LAITS study tips video.

 

The Initial Sketch

Day and Night

The Edit

Day and Night Again

First Color

Final Assets

Filed Under: Fall 2020 | Spring 2021

  • « Previous Page
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • …
  • 51
  • Next Page »

link to LAITS home page

Video STA Home

© 2021 Liberal Arts Instructional Technology Services | Production Credits