STA Blog

Current Sta

Emily Park ~ STA Orientation 2018 Fall!

By

Emily Park ~ STA Orientation 2018 Fall!

Welcome Emily 🙂
i hope you have fun at your STA Orientation!
During the latter part of your STA Orientation,
you’ll design and upload your banner to this blog.
_____________________
FIRST STEP
Photoshop: Design and make your banner
a. Use the photoshop specs for your blog banner that i placed in your STA folder,
on our servers:
path: sta/Emily Park
folder: make-your-sta-blog-banner
file: sta-blog-banner-specs.jpg
_____________________
b. Save your un-merged files back to your STA folder:
path: sta/Emily Park
folder: make-your-sta-blog-banner
SECOND STEP
On this Blog: Make your 1st text post and upload your banner:-)
a. log-in:
_____________________
b. Publishing Help Documentation/Instructions
You must read this WP sites “Publishing Help” before you upload your banner.
Click on each of these links and read the STA publishing help:
_____________________
c. Blog post:
Reflect on the day and write a bit about your about your-self & what you did during orientation
& upload your banner.
* do not merely copy paste images in to your blog.
Always upload images into the “Media” section of blog first,
and then set the image from the media folder to display on your blog.
* “Check the “2018 Fall – 2019 Spring” Category box
for all the blog posts you make this semester and next semester
so that all of your work is documented in the correct semesters.
LASTLY
Comment on Base amp
Let me know you’ve complete this task, via base camp.
Upload a link to this blog, on your base camp to-do.

Valerie Tran ~ STA Orientation 2018 Fall!

By

Valerie Tran ~ STA Orientation 2018 Fall!

Welcome Valerie 🙂
i hope you have fun at your STA Orientation!
During the latter part of your STA Orientation,
you’ll design and upload your banner to this blog.
_____________________
FIRST STEP
Photoshop: Design and make your banner
a. Use the photoshop specs for your blog banner that i placed in your STA folder,
on our servers:
path: sta/Valerie Tran
folder: make-your-sta-blog-banner
file: sta-blog-banner-specs.jpg
_____________________
b. Save your un-merged files back to your STA folder:
path: sta/Valerie Tran
folder: make-your-sta-blog-banner
SECOND STEP
On this Blog: Make your 1st text post and upload your banner:-)
a. log-in:
_____________________
b. Publishing Help Documentation/Instructions
You must read this WP sites “Publishing Help” before you upload your banner.
Click on each of these links and read the STA publishing help:
_____________________
c. Blog post:
Reflect on the day and write a bit about your about your-self & what you did during orientation
& upload your banner.
* do not merely copy paste images in to your blog.
Always upload images into the “Media” section of blog first,
and then set the image from the media folder to display on your blog.
* “Check the “2018 Fall – 2019 Spring” Category box
for all the blog posts you make this semester and next semester
so that all of your work is documented in the correct semesters.
LASTLY
Comment on Base amp
Let me know you’ve complete this task, via base camp.
Upload a link to this blog, on your base camp to-do.

Finished Kids Section of TBH interactives!!

By

Finished Kids Section of TBH interactives!!

In what is possibly the least exciting looking but most monumental post I’ve ever had, I want to announce that we finished the kids section of TBH. I’ve been reviewing every single animation that we’ve done which is why I don’t have much to talk about or even post images of. I think what I’ll do is create a graphic or movie of every single TBH animation together so people can truly appreciate the magnitude of what we’ve done. Once I finish that I will post it here and also use it in the TBH presentation I need to give at the end of the year. In the mean time here’s a beautiful photo of our spreadsheet, green = done.

Coding TBH Site

By

Coding TBH Site

Over the past few weeks I’ve been coding the new TBH site. I’m starting with the homepage which I modeled in the previous posts. Stacy advised to use CSS grids and gave me this site, which I found extremely helpful: https://gridbyexample.com/examples/ .TTo achieve the grid layout I basically followed the tutorial and implemented my own version. Currently each grid box contains an image of the thumbnail I want but that leads to scaling problems with the text and images being fuzzy so I think I’m going to redo it and make it dynamic.

Heres a code snippet of the html I’m using:

Also here’s the current working prototype:

TBH Redesign

By

TBH Landing Page Redesign

 

I was asked by Suloni to redesign the existing TBH homepage which looks like this:

As you can see the design was really dated and uninspiring, especially since the main audience for this website is kids. We needed to update it to make it more tablet friendly/exicting and also give it a more “modern” feel. The client who oversees Texas beyond history typically does not like changes so Suloni had me create two design mockups. One was pretty close to the old design and the other was very different.

1st Mockup:

I tried to keep the same “feel” as the old website but add modern design elements such as the nav box/ drop shadows. I also reformatted header and footer to look cleaner.

 

2nd Design option:

This was my preferred design option. It offers a completely different look and feel from the old home page. It is clean and simple. The large icons are easier to press for children, especially since most will be accessing this site with a tablet. The client ended up choosing this version to our surprise! In the next coming weeks I will be working with Stacy, one of the web developers here, to bring this mockup to life in the new site using CSS/HTML.