2. Creating a Dynamic Page: Service Innovation Showcase
1. Overall Essay
Explore the inception, evolution, and impact of your selected Service Innovation.
3 Short Essays
Delve into the specifics of the Benefits, Harms, and Capabilities surrounding your chosen example.
4 Engaging Images
Visualize key aspects of your Service Innovation, providing a holistic understanding.
1 Informative Video
Enhance your webpage with a compelling video related to your chosen Service Innovation.
HTML Code Assistance
Receive guidance and an example HTML code to effortlessly set up your webpage.
Helpful Tips and Tricks
Learn valuable insights to elevate the quality and appeal of your webpage.
This guide is designed to assist you in crafting a comprehensive webpage featuring your chosen
Service Innovation example. Your finished page will include:
3. Project Progress Tracking
Dates
Record important dates to maintain a timeline of your project's development.
Websites
Document the websites and sources you explore for research and information.
Type of AI Used
Specify the AI tools or technologies utilized in the course of your project.
Prompts Used
Track the prompts you employ for generating content or insights.
Saving Images
Save images created during the project as JPEG files for seamless integration.
Feedback and Questions
Document any feedback received or questions that arise throughout the project.
Ensure effective project management by keeping track of the following:
4. Before We Begin:
Service Innovation
The point of the content you will produce is to
make it easier for people to understand what
service innovation is and why it is so important.
Pick An Example
Choose an example that is both interesting and
historically relevant to service innovations.
Harms and Benefits
Although we want to convey all the benefits of
the example you chose, it is equally as important,
if not more, to display the harms that it caused
to society as well. Nothing is perfect.
It is important to keep a few things in mind
as you go through this process
Think about a regular coffee shop where you walk
in, order your coffee, and wait for it at the counter.
Now, imagine a service innovation like a coffee
subscription app. Instead of waiting in line, you can
pre-order your favorite coffee through the app,
customize it to your liking, and simply pick it up
without any hassle.
This service innovation makes the coffee-buying
process more convenient and tailored to your
preferences, offering a new level of simplicity and
efficiency.
Here are two quick examples to understanding
what service innovations are:
5. Essay
Prompt Journey Using Claude:
1. “Write me a short paragraph explaining how the ATM is an important service innovation”
- Simple start, you can be more specific here or make changes to the output if you aren't sure how
best to start prompting.
2. “ Can you just make it a little more digestible and interesting”
- Asking for these two things made the content a higher quality. Still not exactly what I wanted.
3. “I like it, can you mention how it relates to the importance to service innovations overall”
- By saying "I like it" it gave a similar response, but made the improvements I asked for. Being more
specific will be helpful!
Essay
6. ATM became a
Essay
“When the first automated teller machine (ATM) debuted in 1967, it
revolutionized retail banking services. This innovative self-service
technology enabled customers to access their accounts, withdraw
cash, check balances, and more, all without a human teller. ATMs
made banking more convenient and accessible, allowing customers to
access their money 24/7. Banks benefited too, enabling them to
extend services beyond branch hours and geographic limitations. The
ubiquitous ATM became an iconic representation of automated
convenience. Today, over 3 million ATMs exist worldwide, providing an
essential service that many now take for granted. The advent of the
ATM demonstrated how automated, self-service technologies can
transform industries by providing greater autonomy and efficiency. It
reshaped banking into an on-demand service and was a major
milestone in service innovations that increase customer access and
satisfaction while reducing labor costs. The innovative ATM
exemplifies the immense value that service innovations can provide.”
Final Text for the Essay....But we aren't done!
When it comes to specific,
historical information like the
ones highlighted, we need to
double check it with other
sources on the internet.
Let's do it!
Practicing good ethics is
crucial to the success of your
published work. We need to
double check everything as to
not spread false
information...and make sure
to cite!
Essay
7. ATM became a
Essay
“When the first automated teller machine (ATM) debuted in 1967, it
revolutionized retail banking services. This innovative self-service
technology enabled customers to access their accounts, withdraw
cash, check balances, and more, all without a human teller. ATMs
made banking more convenient and accessible, allowing customers to
access their money 24/7. Banks benefited too, enabling them to
extend services beyond branch hours and geographic limitations. The
ubiquitous ATM became an iconic representation of automated
convenience. Today, over 3 million ATMs exist worldwide, providing an
essential service that many now take for granted. The advent of the
ATM demonstrated how automated, self-service technologies can
transform industries by providing greater autonomy and efficiency. It
reshaped banking into an on-demand service and was a major
milestone in service innovations that increase customer access and
satisfaction while reducing labor costs. The innovative ATM
exemplifies the immense value that service innovations can provide.”
Final Text for the Essay.
Some key observations:
Make sure the essay focuses on
making the concept of "service
innovations" easier to
understand.
How the ATM improved that
service
How the ATM benefitted
the industry
How the ATM made service
innovations more prominent
Essay
8. When it comes to specific, historical information like the ones highlighted, we need to double check it with
other sources on the internet.
Essay
“When the first automated teller machine (ATM) debuted in 1967, it revolutionized retail banking services."
https://www.americanbanker.com/slideshow/the-evolution-of-the-
atm#:~:text=The%20first%20ATMs,on%20Long%20Island%2C%20New%20York.
Be sure to save any sources you come
across. Documenting progress is
extremely important when it comes to
citing and including evidence.
The information matches!
Make sure to double
check all information included in the
output.
Essay
9. ATM became a
Essay
Additional Text Content:
Benefits, Harms, and Capabilities
IMPORTANT:
Highlighting the benefits, harms, and
capabilities of the service innovation
under focus is paramount.
Emphasizing the potential drawbacks
is equally crucial as it lends realism,
demonstrating the significance of
presenting a comprehensive view of
the innovation's multifaceted
impacts!
(Remember to double check information and keep track
of prompts!)
Essay
10. Benefits, Harms, and Capabilities
Image
Image
You will need an image
to accompany your
overall text to help capture
the reader's attention.
The following categories are
optional for additional images
to improve the quality of your
page:
1. Benefits
2. Harms
3. Capabilities
Image Creation:
Using Bing AI Image Generator..
Experiment with different styles and be sure to track your
progress. Have fun with it!
Write down prompts used and any changes you make.
Keep it relevant to the text you generated previously.
11. • Be careful of trying to get certain words, AI struggles to accuratley show text
•
Image
Image
You can try asking for:
- A specific style
- A color to highlight
- Different settings
- People/no people
- Silhouettes
- Emotions
- Points of view
Be creative!
Be careful of trying to get certain words to be in your
image, AI tends to struggle to accurately show text.
13. Image
Image
Final Overall Image Selection:
Prompt used:
"Black and White Old City Only with a
Modern Green and Bright ATM Machine
Only with a Girl Standing at it Glowing and
People in Line in a Bank"
I went with this image because it depicts
several key aspects I waws going for:
- Futuristic feeling with the ATM while
everything else looks to be from an older
era
- Glowing and Eye-Catching ATM
- Correct use of "ATM" writing
14. I recommend going for the same style to display consistency and uniformity among the post.
Image
Image
Do the same process for the other categories:
- Benefits
- Harms
- Capabilities
I recommend going for the same style to display
consistency and uniformity among the post- as shown
below.
Example for Harm:
"An ATM Machine taking jobs from people"
"A green
atm
machine
with a
happy
face"
"A yellow
atm
machine
with open
arms"
"A red
atm
machine
with an
upset
face"
15. I recommend going for the same style to display consistency and uniformity among the post.
Image
Image
To save an image:
- Right click on the picture and select "save
image as"
- Be sure to save the file type as a JPEG so that
we can insert it into the website page later.
- Make sure you keep track of where in your file
you are saving it to so you can easily find it
later.
16. I recommend going for the same style to display consistency and uniformity among the post.
Video
Video
To create the video:
- Go to the HourOne website and select the
option to create a free video.
- Insert the text you created earlier into the
prompt box as seen on the right.
- You may have to make adjustments if your text
is too long in length.
17. I recommend going for the same style to display consistency and uniformity among the post.
Video
Video
The Video Script:
- I recommend that you use a shorter version of
your text. This way the viewer doesn't get
bored.
- You can simply ask the text AI (Claude AI) to do
this for you!
- As you can see in the example image, I asked
the AI to use the same information and text,
but to make it more "Concise".
- It performed well, but, as always, make sure
you double check the info.
18. I recommend going for the same style to display consistency and uniformity among the post.
Video
Video
To Create the Video:
Note: The Playbook itself goes over how to edit
the videos in more detail
- On the right, you can see some of the changes
made to ...
- The voice
- The speaker
- The images
- The format
- Videos
- The script
- The order
This is easier than you might think.
Again... experiment!
19. I recommend going for the same style to display consistency and uniformity among the post.
Video
Video
Saving the Video:
- When you are done, click on "Save Video" In the upper right corner of the screen.
- Make sure to preview the voices in each section to make sure nothing sounds strange.
- This could take several minutes, so while that is loading feel free to work on the next section.
20. HTML
HTML
• Using Chat GPT, I asked it to help me
create the HTML code for the website
shown on the right.
• This took several attempts, trial and error,
and adjustments.
• You can try to do your own, or use the
template I created from this code to make
a page that looks like this!
The Link to this code is: Here
Or copy and paste into your browser:
https://docs.google.com/document/d/1OgW
61iPyeuvumikQFxmfK8itKfNUfxxavkf9zjmpIu
A/edit?usp=sharing
21. HTML
HTML
To create the HTML code itself, open the
Notepad app on your device.
• Enter the code and select "Save As"
• Enter the name you wish to call it and
end it with ".html"
• It is best to not use spaces when naming
a file.
• Be sure to save it in a folder that also
includes the JPEG images you created
earlier!
Good Examples:
"MyHTMLCode.html"
"My_HTML_Code.html"
Bad Examples:
"My HTML Code.txt."
"Myhtml Code.html"
22. HTML
HTML
This section may take the longest.
Double check to make sure you included any
citations necessary at the end of the page.
Also be sure to include any additional information
that may be needed.
Feel free to add more depending on the look of
the page you are going for.
Remember, the point of your page creation
is to help people better understand what service
innovation is through historical examples.
Make sure the content helps with this mission.
23. I recommend going for the same style to display consistency and uniformity among the post.
Tips
Tips
• Documenting and Taking screenshots of progress as you go will be
better in the long run so you don't have to go back and do it all at the
end.
• If you get stuck at a certain point, remember, you can ask Claude for
help as well! Just give it the prompts or any information you are
working with and ask It to help you. If you get lost though, feel free
to reach out to a team member.
• Try not to make the page too wordy- as it will lose the interest of the
reader entirely.
• Try to make the images as relevant to each paragraph and section as
possible. They don't have to be the same theme, but it does help
with continuity!
Have fun with it! Good Luck! -Abigail Moliski
Made with Bing AI Art Generator
Prompt: Green vine wrapped around computer screen
11/12/2023