TBH: Rusk County Map Update Pt.2

Welcome back to the Texas Beyond History Saga. Today we feature the newest installment in the series; “TBH; Rusk County Map Update Pt.2 – Electric Boogaloo.” As you might remember, the essence of this project is to develop an interactive image through Canvasser for a new Texas Beyond History page.

 

To recap what I said in the meeting last week but didn’t write in my blog, the map is currently functional as follows: the external links (the ones with the descriptions and images from each of the highlighted locations) now open within the same tab as the map’s page, and the user will have to click on the browser’s back space to return the map or –and I’ll elaborate on this in a bit– click on special buttons on each external site that will take them back to the map’s page. I also made an update to the links on the map. Now, the pages you are taken to when clicking on the hotspots take you to the –now pending– links where the pages will be once they’re done, rather than to the backup draft page.

 

 

Now that the interactive map itself is pretty much done, the next step is to focus on the web development part of the assignment. Specifically, we have to focus on three different sites. One, the page where the map will be placed after all; two, the draft page where they want us to embed the map now; and three, a sample page (specifically for the Ware Plantation spot) for them to use as a reference to copy/paste the format and rework that into all the other sites they will make. So, given that this is a lot to ask of us without the proper clarifications, as Lauren, from the webdev team helped me build a little something-something for the Ware Plantation site, I worked on some mockups to get the client to tell us specifically what they think.

 

 

Also, to clarify the vocabulary I used in the third mockup, here is what I mean by that:

Keep: Leaving the element exactly as it is.
Delete: Getting rid of the element altogether.
Replace: Continuing to use the concept of the element (i.e. a header or title) but replacing the format to a different style of your choosing.
Edit: Continuing to use the concept and specific element but making further changes to improve upon it. Make sure to further elaborate on the edits to be made. For example, keeping the image but resizing it, requesting to move the text below the image, removing a specific portion of the text, changing the wording on the titles, etc.

 

Finally, after sending all of that in an email to the client [response still pending], today I worked on a flowchart of the collaboration process throughout this project. I haven’t had any feedback on that yet, but so far, this is how that looks like:

Miscellaneous Tasks

Howdy y’all. This week I didn’t work on many new projects that you don’t already know about. I will be updating you all on those, so keep an eye out for my upcoming posts. But for now, let me talk to you guys about some of the smaller tasks I completed this week.

 

First off, one of the biggest news of the week is that Tuesday was the last work day of two of our STAs; Athena, who started out at the same time as I did a little over a year ago; and Jake, who has been a core STA since before I joined the program. So, following our good ole farewell tradition we have here at the Design/WebDev STA team, I made two goodbye cards this week. They were really cool too. I made sure to personalize the design a bit, so I made Athena’s tennis related, and Jake’s more tech/game related. I won’t add them to this post because it feels weird to post about what is supposed to be a heartfelt gesture. But just so you know, those were two of the minor tasks I completed this week.

 

Another miscellaneous task I completed this week was a mandatory UT training, specifically the Information Security Awareness training. Not much to say about that. I just watched the videos, completed the tests, and overall reinforced my knowledge on information security. Which, if you may not know, is the kind of security related to password protection, viruses, email scams, etc.

 

Finally, I worked on a some blog related stuff. As in, we are holding a Blog Banner Contest to determine the new design for the blog banner. This was not a mandatory assignment, but I had some inspiration over the weekend and some time this week to get it done, so I went for it. I also tested them with the old STA caricatures and they both looked neat. I’m not even thinking about the contest to be honest, I’m just happy I designed a cool looking retro banner, hehe.

 

Here are the two designs I proposed:

 

Nevermind… It’s a secret 👀

 

Oh, I also worked on editing my blog caricature too, but it’s not worth uploading. I just made my hair longer, but it’s the same design, hehe.

Draft Web Service Page In Cascade Update

Daaang Daniel, back at it again with the Web Service Page… (sorry and you are welcome for the old Vine reference)…

 

Anyway, on todays news, we have a new update on the Draft Web Service Page situation. In brief, last time I was working on a few different banner options for Suloni to look at, but they were a but too out of the box for what the project requires. So, not long ago, I resumed my work on this project and got down to business on a new banner following Suloni’s feedback into this new direction.

 

Long story short, this is what the banner looks like now! I’m also excited because I got to work with UT’s official illustrations and even got to alter them a bit to fit the purpose of the banner.

 

 

After I got approval for that, I was assigned the followup task to work on three more things (for now, at least).

1. Design a new illustration (still using the official UT illustrations) to include within the content of the page.

2. Mockup the Web Service Page on my own STA Cascade site.

3. Draft the content of the page to reflect the services that will be offered through it and/or to redirect them to the right assistance provider.

 

So, without further a do, you can find all those cool things in the following link: https://liberalarts.utexas.edu/sta-12/draft-web-service-page/, enjoy! I will also include the content body illustration I designed for the page bellow. I’m proud of it…

 

I think we are still waiting on suggestions and ideas for next steps from the web development team, so final update coming soon to a theater near you. 👍

TBH: Rusk County Map Update

Welcome back to another installment of Texas Beyond History: A Rusk Country Map Story, ft. special guest Canvasser… So, as you might remember from a few posts ago, I was tasked to develop an interactive image through Canvasser for a new Texas Beyond History page. The image in questions is meant to be a map (black 7 white) with colored-in spots to let the user know that those are the interactive spots. Once the user clicks on them, a new page [for every element] will open up on a new tab of the user’s browser with pictures and information about each of the special locations.

 

Since last time, we have gone through a bunch of different updates on the project. After I had my initial conversation with the client I started working on the map on Canvasser. That is, until I stumbled upon the first obstacle: what Canvasser feature would be the most appropriate to use for these click elements? I was lucky enough to get some feedback from a fellow STA on that… but then came the second obstacle: who was going to make the external links (the ones that will pop open on a new tab after clicking on the map locations)? And if that were to be me, how would I do that? That question right there sparked a whole new phase in the development of this project. This new era being defined by various meetings, not only with myself and Suloni, but with the web development team. After the initial meeting with this new team, we came to a few conclusions and some new questions for the client. So, I drafted a new email and sent it over his way.

 

Over the weekend the client responded to my email. As soon as I started my shift on Monday, I let the rest of the team know of his response. At this point we were not sure Canvasser would be able to carryout the needs of the project, and we were thinking of finding an alternative program to build the map with, but the client’s response made it very clear that we would need to use Canvasser. So I got back to business using the method my fellow STA had suggested earlier, which was the loadpage feature. I also got a suggestion by someone else in the team, but sadly that feature of Canvasser is not working properly.

 

Moving on with loadpage, I was able to get far with the map’s interactive elements. But a problem remains: due to a security measure implemented by different browsers, the feature that lets a new tab pop open requires that the user clicks on a security text first. Needless to say, that’s not ideal. So, the project phase we are currently at is finding workarounds to this inconvenience.

 

You can see the current Canvasser Interactive by clicking on the map to the right, or right here. As of right now, most of the clickable elements are working the loadpage feature and dealing with the additional clickable text issue. There are only three exceptions. First, the of you click on the Camden text, a new button will pop up. I was trying to work around the issue previously mentioned, but I accidentally ended up adding an extra step with the button; so that was a fail. Second, the hotspot on the Hendrick Plantation works just as the rest, except that the background color that appears with the security text is orange, rather than transparent. Finally, Ware Plantation is working smoothly through an alternative loadpage event that activates new pages opening up on the same tab rather than a new one. Feel free to put all of these to the test! (Bear in mind that changes will be coming soon, so those actions won’t last forever.)

ECO 304K: Studio Course Graphics

Hi blog! Long time no see… I had a brief hiatus last week, but I’m back and for the first time ever working in-person at the office. So that’s exciting! Anyway, let me talk about this project that I was working on before my vacation week.

 

So, ECO 304K is an Intro to Microeconomics at the College of Liberal Arts, and recently they requested some Canvas and Studio course graphics for this upcoming Fall semester. I can bore you with the details of all the stuff they asked for, but I really just want to talk about two of the requests, which were also some the ones I focused on before handing the project over to another STA. (I say some because I technically also worked on the buttons and desk skirt, but those aren’t as fun to talk about).

 

First, I worked on the stingers. Some of the ones they asked for were from our usual stinger supply. However there were four more custom stingers that they requested: a Kahoot stinger, a Demonstration stinger, an Alumni Interview stinger, and a Q&A stinger. I worked on a lot of different versions for these and thankfully got great feedback from a fellow STA. Here are their final results:

 

 

The other thing I mostly worked on was the digital backdrop. The challenge for this one was to, first off, find a free-for-use image (or one licensed by us) that depicted a Rube Goldberg Machine, and then add a piggy bank to it, whilst also editing it to fit the chosen color scheme for the course… That being said, the following three are (first) the original image and (the following two) my best efforts to edit the image:

 

 

This is the final design by the STA that followed up with this project. I think they did a great job! So, shout out to Poonum (we will miss you)!

 

TBH: Rusk County Map: Canvasser Interactive

This is a project for which I’m tasked to develop a Canvasser Interactive for a new Texas Beyond History activity called Rusk County Map. The point of this new map-based interactive page is to have a historic black and white map of the Rusk County area upon which are colored/highlighted place names and features (e.g. a river). Those colored/highlighted spaces are meant to be hot/link spots so that, when clicked, a short separate page (housed in …/rusk/images/ folder) would open with a few paragraph description and maybe a few embedded images. Sort of like what the Explore the Sites page on the Cairn Burials special exhibit is doing: http://www.texasbeyondhistory.net/cairn/explore.html

 

My main task here is to program the interactions on the map using Canvasser. This should be a challenging yet interesting project considering I have not worked on Canvasser since I did the basic training for it back in November 2020. But I do have some fellow STA’s to help me out as a support team, so that’s good.

 

As of right now we are still waiting for the client to send over the assets we’ll need to start, but for now I’ll leave you with some of the questions I have already prepared for them:

 

• What dimensions will the Canvasser Interactive have?
  • w = 956 px
  • h =  ??? px
• Will I work on the design elements of this project as well or just putting together the Canvasser Interactive?
  • Creating buttons/pop-ups?
  • Colorizing the map?
  • If so, please specify the deliverables.
• Interactive features are required?
  • i.e. buttons, toggle elements, click and drag objects, pop-ups, conditional pop-ups, text entry boxes…
• After the user clicks in the hot/link spots, will the descriptive paragraphs/embedded images pop up within the Canvasser Interactive space or on new tabs/windows like on the Cairn Burials ‘Explore the Sites’ example provided?