• We are STAs
    • Daniela Caballero
    • Leilani Cabello
    • Lorena Chiles
    • Marissa Devivar
    • Luisa Matzner
    • De’sha Bass-McClellan
    • Adrian McKee
    • Thang Truong
    • Carrie Wang
  • We were STAs
  • STA Presentation
    • STA Presentation 2017
    • STA Presentation 2016
  • Testimonials
  • Resources
  • Home

STA Blog

Qiwei Li

Qiwei Li

Institute of Digital Scholarship logo and banner designs

May 12, 2017 By Qiwei Li

I was asked to work with the department for digital humanities to create a logo and banner for the website. After meeting with the client, I understood that they wanted a combination of digital/techy, and literature. My first sketches looked like this:

I created drafts of a logo that combined a book, the sides of the book creating the “S” in IDS (Institute for Digital Scholarship). This is the mockup from photoshop:

However, it didn’t have the “modern” feel to it, and the client was particular fond of pixelated effects to convey the digital aspect of their work. I took a break from the logo and went to work on the banner instead.

This banner was quickly accepted by the client; they loved it! From there, I got a better idea of what I should create for the logo. Knowing their color choices, I created three different iterations of the similar simple design:

The favorite turned out to be the second, which was my personal favorite as well. The three overlapping squares represent books, while the flat design lends modernity.

Final design:

This was a very fun project to work on, and was my first time working on a solo design project with a client. One valuable thing I have learned is the importance of timely communication when working with clients. I always love to get quick feedbacks, so they must appreciate it as well when I place high priority on their projects. I want to thank Suloni and Andre and Ruben for working closely with me this year on several of our projects, as well as the other wonderful STAs. I will see you guys after summer!

 

 

 

Filed Under: 2016 - 2017

STA Presentation Slides for Joe

May 4, 2017 By Qiwei Li

Filed Under: 2016 - 2017

Magazine Mockup for Journalism Course

March 24, 2017 By Qiwei Li

This week Lauren, Bethany and I were each responsible for producing one mockup of a graphic to be used in an online course in journalism. The professor wanted to convey the central idea of her class with one image, expressed either in the form of a social media newsfeed, newspaper, or magazine. Given some specifications, I first came up with the design below:

    I wanted to color the icon in an interesting way, but with the many elements on there it just ended up looking messy. Here are some later designs. 

This one didn’t have the right colors

The design I submitted as final was the one above, with the hard drop shadow.

 

 

Filed Under: 2017-2018

Newsletter Template

February 24, 2017 By Qiwei Li

I worked on my first project using Indesign, and it was pretty fun! Roopa, Bethany and I created templates for a materials for various Psychology labs. I designed and created newsletter templates, using a new logo for each of the eleven labs.

 

Filed Under: 2016 - 2017

Updating Banner

February 8, 2017 By Qiwei Li

Today I completed a simple task on cascade: updating the banner on the page below.  

 

First I had to use PhotoShop to reformat the new image and change the resolution

After uploading the new image in Cascade I published the new page.

Filed Under: 2016 - 2017

Design + CSS: Email Template for UROP

February 6, 2017 By Qiwei Li

I had began working on this project since before winter break! The task was to design and code up from scratch an email template to market undergraduate research in the liberal arts department.

I started by creating a mockup of how I wanted my template to look. My goal was to emphasize the benefits of participating in research to first catch the students’ attention, then offering some examples of what they could be working on. All this, of course, would be in accordance of the “landing page rules” where I have sufficient action buttons where the students would want them.

(original mockup done in photoshop)

 

Then Andre suggested that I add a section with “testimonials” from previous students who have participated in research. Below is the resulting mockup:

It took me a few tries to create the right structure in CSS to create this template. It looks simple but creating this in code was a bit complex, with countless divs separating everything. It took some planning beforehand:

my planning looked like boxes within boxes to fit all the elements how I want them. This was an important and valuable  learning experience, as this template was the most complex CSS I had worked with at this point

Some issues I ran into: working with tables, trying to align objects to the center, figuring out the best way to move objects while making the template remain responsive

But at the end (and with lots of help from Andre and Maxwell) I finally completed my first coding project 🙂

Here is a link to CodePen for the final product and code.

 

 

 

 

 

 

Filed Under: 2016 - 2017

  • « Previous Page
  • 1
  • 2
  • 3
  • 4
  • Next Page »

link to LAITS home page

Video STA Home

© 2023 Liberal Arts Instructional Technology Services | Production Credits