BCD to 7-Segment Display

Posted on September 7, 2018 by Administrator Posted in A Level Concepts, Computer Hardware, Computer Science, Computing Concepts, Physical Computing

What is BCD code?

In computing and electronic systems, binary-coded decimal (BCD) is used to encode decimal numbers (base-10 numbers) in a binary form where each decimal digit is represented by a nibble (4 bits).

For instance decimal number 5 is represented as 0101 in BCD as 5 = 4 + 1

8	4	2	1
0	1	0	1

The 10 digits in BCD:

Decimal Digit	BCD Nibble
0	0000
1	0001
2	0010
3	0011
4	0100
5	0101
6	0110
7	0111
8	1000
9	1001

Numbers larger than 9, having two or more digits in the decimal system, are expressed one digit at a time using on nibble per digit. For example, the decimal number 365 is encoded as:

0011 0110 0101

7-Segment Display

A lot of electronic devices use 7-segment displays (Watch, alarm clock, calculator etc.).
Typically 7-segment displays consist of seven individual coloured LED’s (called the segments). Each segment can be turned on or off to create a unique pattern/combination. Each segment is identified using a letter between A to G as follows:

The 10 descimal digits can be displayed on a seven-segment display as follows:

BCD to 7-Segment Display: Truth Tables & Karnaugh Maps

We will use four inputs A,B,C and D to represent the four BCD digits as ABCD (A is the most significant digit, D is the least significant digit). When creating an electronic circuit we could use 4 switches to represent these 4 inputs.

We will need 7 outputs one for each segment. So let’s investigate each segment one at a time.

Segment ABCDEFG

Segment A should be on for the following values:

BCD: 0000	BCD: 0010	BCD: 0011	BCD: 0101
BCD: 0110	BCD: 0111	BCD: 1000	BCD: 1001

Segment A should be off for the following values:

BCD: 0001

BCD: 0100

Segment A should also be off for the following BCD values which are not used to represent decimal digits values from 0 to 9:

1010
1011
1100
1101
1110
1111

Note that these values could be used to represent hexadecimal values A to F (10 to 15). Here we will not display anything instead.

Hence the Truth Table for Segment A is as follows:

Inputs				Output
A	B	C	D	Segment A
0	0	0	0	1
0	0	0	1	0
0	0	1	0	1
0	0	1	1	1
0	1	0	0	0
0	1	0	1	1
0	1	1	0	1
0	1	1	1	1
1	0	0	0	1
1	0	0	1	1
1	0	1	0	0
1	0	1	1	0
1	1	0	0	0
1	1	0	1	0
1	1	1	0	0
1	1	1	1	0

This Truth table can be represented using a Karnaugh Map:

Karnaugh Map for Segment A

Follow the same process to define the Truth Table and Karnaugh Map of the B segment:

Follow the same process to define the Truth Table and Karnaugh Map of the C segment:

Follow the same process to define the Truth Table and Karnaugh Map of the D segment:

Follow the same process to define the Truth Table and Karnaugh Map of the E segment:

Follow the same process to define the Truth Table and Karnaugh Map of the F segment:

Follow the same process to define the Truth Table and Karnaugh Map of the G segment:

BCD to 7-Segment Display: Boolean Expressions

The Karnaugh maps will help us define the Boolean Expressions associated with each of the 7 segments.

Segment ABCDEFG

Karnaugh Map:

Karnaugh Map – Segment A

Boolean Expression:

Boolean Expression for Segment A

Use the Karnaugh Map for the B segment to define the Boolean Expression of the B segment.

Use the Karnaugh Map for the C segment to define the Boolean Expression of the C segment.

Use the Karnaugh Map for the D segment to define the Boolean Expression of the D segment.

Use the Karnaugh Map for the E segment to define the Boolean Expression of the E segment.

Use the Karnaugh Map for the F segment to define the Boolean Expression of the F segment.

Use the Karnaugh Map for the G segment to define the Boolean Expression of the G segment.

BCD to 7-Segment Display: Logic Gates Diagrams

We can now convert each Boolean expression into a Logic Gates circuit to link our 4 inputs (switches) to our 7-segment display using a range of logic gates.

Segment ABCDEFG

Boolean Expression:

Booelan Expression for Segment A

Logic Gates Diagram:

Segment A – Logic Gates Diagram

Use the Boolean Expression of the B segment to draw the logic gates diagram required to control the LED of the B segment.

Use the Boolean Expression of the C segment to draw the logic gates diagram required to control the LED of the C segment.

Use the Boolean Expression of the D segment to draw the logic gates diagram required to control the LED of the D segment.

Use the Boolean Expression of the E segment to draw the logic gates diagram required to control the LED of the E segment.

Use the Boolean Expression of the F segment to draw the logic gates diagram required to control the LED of the F segment.

Use the Boolean Expression of the G segment to draw the logic gates diagram required to control the LED of the G segment.

Testing

You can now recreate your logic gates circuit using logic.ly to test if it behaves as expected for all 16 BCD entries.
e.g. For Segment A:

Logic Gates Circuit for Segment A

BCD to 7-Segment Display Integrated Circuit

All these 7 logic gates diagrams can all be integrated into one single integrated circuit: The CD74HCT4511E is a CMOS logic high-speed BCD to 7-segment Latch/Decoder/Driver with four inputs and is used to use these 4 inputs (BCD nibble) to control the display of a 7-segment display.

Hex/BCD to 7-Segment Display Integrated Circuit

A very similar approach can be used to display hexadecimal digits as these are also based on a nibble per digit.

The extra values that we discarded previously (BCD: 1010, 1011, 1100, 1101, 1110, 1111) can be used to represent the extra 6 digits available in hexadecimal:

BBC micro:bit Counter using a 7-Segment Display

Posted on September 4, 2018 by Administrator Posted in BBC micro:bit, Computer Hardware, Computer Science, Computing Concepts, Physical Computing

The aim of this challenge is to create a countdown timer, controlled by a BBC micro:bit that will display the numbers on a screen using a 7-segment display. A lot of electronic devices use this approach to display numbers on a LED or LCD screen. (Watch, alarm clock, calculator etc.)

Typically 7-segment displays consist of seven individual coloured LED’s (called the segments). Each segment can be turned on or off to create a unique pattern/combination. Each segment is identified using a letter between A to G as follows:

The following truth table shows which segments need to be on to display the digits from 0 to 9:

Digit	A	B	C	D	E	F	G
	1	1	1	1	1	1	0
	0	1	1	0	0	0	0
	1	1	0	1	1	0	1
	1	1	1	1	0	0	1
	0	1	1	0	0	1	1
	1	0	1	1	0	1	1
	1	0	1	1	1	1	1
	1	1	1	0	0	0	0
	1	1	1	1	1	1	1
	1	1	1	1	0	1	1

Step 1: The electronic circuit

To complete this challenge you will need:

1 breadboard
8 resistors of 220Ω each
1 7-segment display (common anode)
1 BBC micro:bit
1 micro:bit edge connector
20 wires

Here is the circuit that you will need to re-create:

Step 2: Python Code

To program your BBC micro:bit you will use the Python editor and copy and paste the following code:

#micro-bit Counter using a 7-Segment Display - www.101computing.net
from microbit import *

pins = [pin0, pin1, pin2, pin8, pin12, pin13, pin14, pin15]
digits = ["11111100","01100000","11011010","11110010","01100110",
          "10110110","10111110","11100000","11111110","11110110"]

while True:
    for i in range(0,10):
        bits=digits[i]
        for j in range(0,8):
            pins[j].write_digital(int(bits[j]))
        display.scroll(str(i))
        sleep(1000)

Your 7-segment display should display all the digits, counting up from 0 to 9.

Your Challenge

Update the code to:

Create a count down timer, going from 9 to 0.
Allow the user to pause and restart the countdown timer using the A and B buttons of the micro:bit.

Tagged with: BBC micro:bit

Logic Gates Tester Kit

Posted on September 3, 2018 by Administrator Posted in Computer Hardware, Computer Science, Computing Concepts, Physical Computing

3rd Generation computers used integrated circuits.

The purpose of this challenge is to create an electronic circuit used to test and identify logic gates integrated circuits.

Logic gates are built as integrated circuits (also referred to as chips, or microchips). An integrated circuit is a set of electronic circuits on one small flat piece (or “chip”) of semiconductor material, normally silicon. The integration of large numbers of tiny transistors into a small chip results in circuits that are smaller, cheaper, and faster than those constructed of discrete electronic components.

Each circuit has a code printed on them which is used to identify the circuit. (e.g. See List of 7400 series integrated circuits on https://en.wikipedia.org/wiki/List_of_7400_series_integrated_circuits)

Each circuit is different and you need to know how the circuit is wired internally to use it in your own circuits (to indentify the purpose of each pin). See image below as an example of integrated circuit 7408 which consists of four AND gates.

Integrated Circuit 7408: Quad 2-input AND gate

Your Challenge

For this challenge, we will assume that you have some integrated circuits (ICs) but do not know which logic gates they consist of. Instead of looking up for their code on the Internet, you will create an electronic circuit and use this circuit to test how your IC behaves. Your circuit will have:

Two inputs: the yellow and a blue button on the diagram below.
One output: the green LED on the diagram below.

By using the buttons and writing down the outputs, you will be able to draw the truth table of this logic gate and hence identify which logic gate is used in this IC.

Input A	Input B	Output
0	0
0	1
1	0
1	1

Check this blog post to investigate the truth tables for some of the key logic gates.

Logic Gates circuits available on: kitronik.co.uk.

Sliding Puzzle

Posted on August 29, 2018 by Administrator Posted in Computer Science, HTML, CSS & JavaScript, JavaScript, Solved Challenges

The aim of this challenge is to use HTML, CSS and Javascript to create an interactive sliding puzzle.

Step 1: Creating 9 tiles from a single picture, using CSS

Our aim is the use a single picture file called flower.png and to create 9 CSS classes for each tile of the picture as displayed below:

We will create our tiles using DIV tags. We will use the flower.png picture file as the background for each tile and by applying different background-position we will create the 9 different tiles as needed.

.tile1 { width: 120px; height: 120px; background: url(flower.png) background-position: left top; }
.tile2 { width: 120px; height: 120px; background: url(flower.png) background-position: center top; }
.tile3 { width: 120px; height: 120px; background: url(flower.png) background-position: right top; }
.tile4 { width: 120px; height: 120px; background: url(flower.png) background-position: left center; }
.tile5 { width: 120px; height: 120px; background: url(flower.png) background-position: center center; }
.tile6 { width: 120px; height: 120px; background: url(flower.png) background-position: right center; }
.tile7 { width: 120px; height: 120px; background: url(flower.png) background-position: left bottom; }
.tile8 { width: 120px; height: 120px; background: url(flower.png) background-position: center bottom; }
.tile9 { width: 120px; height: 120px; background: white; }

Step 2: Table Layout

We now need to position our 9 tiles using a 3×3 table layout in HTML & CSS. To do so, we will use the display property in CSS using the following three options:

display: table;
display: table-row;
display: table-cell;

This is an alternative to using the <TABLE>, <TR> and <TD> tags in HTML.

<div id="table" style="display: table;">
   <div id="row1" style="display: table-row;">
      <div id="cell11" class="tile1" style="display: table-cell;"></div>
      <div id="cell12" class="tile2" style="display: table-cell;"></div>
      <div id="cell13" class="tile3" style="display: table-cell;"></div>
   </div>
   <div id="row2" style="display: table-row;">
      <div id="cell21" class="tile4" style="display: table-cell;"></div>
      <div id="cell22" class="tile5" style="display: table-cell;"></div>
      <div id="cell23" class="tile6" style="display: table-cell;"></div>
   </div>
   <div id="row3" style="display: table-row;">
      <div id="cell31" class="tile7" style="display: table-cell;"></div>
      <div id="cell32" class="tile8" style="display: table-cell;"></div>
      <div id="cell33" class="tile9" style="display: table-cell;"></div>
   </div>
</div>

Step 3: Adding Interactivity and Game Logic using JavaScript

For each cell we will add an onClick attribute to call a JavaScript function to implement the game logic when the user clicks on one of the 9 cells.

We will also add a re-shuffle button to shuffle all the tiles and start a new game.

Full Code

We have implemented the HTML and CSS code above and added on onClick attribute on each tile. When a tile is clicked the javascript function clickTile() is called. This is where the code will check if the tiles can be swapped.

We have also added the “New Game” button and the JavaScript code to reshuffle all the tiles of the grid.

See the Pen Sliding Puzzle by 101 Computing (@101Computing) on CodePen.

Note that this script uses one picture. In case this picture is not displaying properly, you may have to replace its URL in the CSS code, using the following address:

Flower Image: https://www.101computing.net/wp/wp-content/uploads/flower.png

Your Challenge

Amend the HTML, CSS and JavaScript code provided above to create a sliding puzzle based on a 4×4 grid (instead of 3×3).

Tips:

Start by changing the HTML code to add enough <DIV> tags to create a grid of 16 tiles.
Change the CSS code to add extra classes for .tile10, .tile11, … to .tile16.
Not that you will have to use more accurate background positioning using the following approach:
.tile10 { width: 90px; height: 90px; background: url(flower.png) background-position: -90px -180px; }
You will also need to revisit the CSS definitions for classes .tile1, .tile2, … to .tile9.
Note that the white tile should now be tile 16.
Adapt the JavaScript code to ensure it works with a 4 by 4 grid instead of a 3 by 3 grid.

Solution...

The solution for this challenge is available to full members!
Find out how to become a member:
➤ Members' Area

Tagged with: CSS

Guitar Chords Reader

Posted on July 27, 2018 by Administrator Posted in Computer Science, Python - Advanced, Python Challenges

The idea of this python challenge is to write a python program to help guitar players learn and practise new songs.

Our program will read all the chords used in a song and display and animate a visual representation/chart of the chord being played.

First, let’s recap what are the main chords when playing the guitar:

The code appearing underneath each chord indicates the position of the fingers as described on each chart. With this code:

“x” means the string is not played,
“0” means the string played as an open string,
a number tells you which fret to place your finger on.

Python Code

The following python code makes use of different data structures:

chords is a dictionary where each chord (e.g. C) if given a “fret notation” such as “x32010”
songChords is a list containing all the chords used in the given song

The subroutine displayChord() takes one parameter, the name of the chord (e.g. “C”) and displays the chart for this chord. e.g.

C
x_____
||||O|
||O|||
|O||||
||||||

Your Challenge #1

You can improve this challenge by adding more chords to the dictionary.

You can then add your own songs to this code and let the user decide which songs they would like to visualise.

You can use websites such as www.ultimate-guitar.com to find all he chords with their “fret notation” used in wide range of songs.

Your Challenge #2

How could you improve this code further to display the lyrics alongside the chords being played?

Text Based Animations

Posted on July 17, 2018 by Administrator Posted in Computer Science, Python - Beginner, Python Challenges, Solved Challenges

In this challenge we will use Python code to create text-based (ASCII) animations. Each of these animations is using a main loop that repeats the given code every 0.2 seconds and clear the screen between two iterations (frames).

Check our four animations below:

Flying RocketHello World AnimationRolling Die AnimationSpace Invader Animation

Flying Rocket Animation

Hello World Animation

This animation use string slicing to animate any piece of text!

Rolling Dice Animation

This animation uses the random library to simulate rolling a die:

Space Invader Animation

If you have ever played the game Space Invaders, you will remember the path that aliens follow, progressively coming down towards your spaceship.

Your Task

Create your own text-based animation using a similar approach. You can get started by tweaking any of the animations provided above.

Here are some ideas of text based animations you could recreate:

Solution...

The solution for this challenge is available to full members!
Find out how to become a member:
➤ Members' Area

Tagged with: iteration

Splash Screen and Progress Bar

Posted on July 17, 2018 by Administrator Posted in Computer Science, Python - Beginner, Python Challenges, Solved Challenges

Adding a Splash Screen to your Python Projects

A splash screen usually appears for a few seconds while a game or program is launching. It can contain basic information such as the name of the game and its version number.

The following Python trinket shows how you can easily create a basic text-based splash screen to reuse in your existing projects:

Adding a Progress Bar to your Python Projects

A progress bar is a graphical control element used to visualise the progression of an extended computer operation, such as a download, file transfer or installation. Sometimes, the graphic is accompanied by a textual representation of the progress in a percent format.

The following Python trinket shows how you can easily create a progress bar screen to reuse in your existing projects:

Solution...

The solution for this challenge is available to full members!
Find out how to become a member:
➤ Members' Area

Tagged with: iteration

Football Results Tracker

Posted on July 8, 2018 by Administrator Posted in Computer Science, Python - Intermediate, Python Challenges, Solved Challenges

You have been asked to create a program to keep track of the scores from the football Premier League.

Your program will store match results in a text file using the following format:

home team;away team;home score;away score;

For instance, after a few games your text file may contain the following information:

Chelsea;Everton;2;0;
Liverpool;Arsenal;4;0;
Crystal Palace;Swansea City;0;2;
Newcastle United;West Ham United;3;0;
Manchester United;Leicester City;2;0;
Manchester City;Everton;1;1;
Swansea City;Manchester United;0;4;
Liverpool;Crystal Palace;1;0;

results.txt

To complete this challenge you will need to read more about how to read through a CSV file.

Task 1:

Your program should include:

An option to input and append a new line / match score to the text file. To do so the program will:
- Ask the user to input the name of the Home team,
- Ask the user to input the name of the Away team,
- Ask the user to input the Home Score (number of goals scored by the home team.),
- Ask the user to input the Away Score (number of goals scored by the away team.),
- Append all this information at the end of the text file.

Task 2:

Create another option where the program will:

Ask the user to display all the scores on screen using the following format:

Home Team – Home Score:Away Score – Away Team

Task 3:

Create a third option where the program will:

Allow the user to enter a team name to display all the results of this team.
Calculate and display the number of points of a team; knowing that a team scores 3 points for a win, 1 point for a draw and 0 point for a loss.

Top-Down Modular Design

This diagram represents the main components of our system:

Python Code

We have started the code for you by implementing a basic menu structure. You task is to implement the code for each one of the three options:

Solution

Task 1: View Solution

Check the following addScore() function and see how you could use it to solve task 1:

def addScore():
  print("--- Adding New Score ---")
  homeTeam = input("Type the name of the home team:")
  awayTeam = input("Type the name of the away team:")
  homeScore = input("How many goals for " + homeTeam + "?")
  awayScore = input("How many goals for " + awayTeam + "?")
  
  #Append data at the end of the text file
  file = open("results.txt","a")
  file.write("\n" + homeTeam + ";" + awayTeam + ";" + homeScore + ";" + awayScore + ";")
  file.close()
  print("Your match score has now been added.")

Task 2: View Solution

Check the following displayResults() function and see how you could use it to solve task 2:

def displayResults():
  #Output all scores stored in the text file
  print("--- All Scores ---")
  file = open("results.txt","r")
  for line in file:
    data = line.split(";")
    homeTeam = data[0]
    awayTeam = data[1]
    homeScore = data[2]
    awayScore = data[3]
    print(homeTeam + " - " + homeScore + ":" + awayScore + " - " + awayTeam)
  file.close()

Task 3.a: View Solution

Check the following displayTeamResults() function used to perform a linear search on the text file to find all the scores of a given team (task 3 part a):

def displayTeamResults():
  print("--- Team Scores ---")
  team = input("Type the name of a team:")
  
  #Display all the scores for the given team using a linear search
  file = open("results.txt","r")
  for line in file:
    data = line.split(";")
    homeTeam = data[0]
    awayTeam = data[1]
    if team == homeTeam or team==awayTeam:
      homeScore = data[2]
      awayScore = data[3]
      print(homeTeam + " - " + homeScore + ":" + awayScore + " - " + awayTeam)
  file.close()

Task 3.b: View Solution

Check the following displayTeamPoints() function used to perform a linear search on the text file to find all the scores of a given team and calculate the total league table points for this team (task 3 part b):

def displayTeamPoints():
  print("--- Team Scores ---")
  team = input("Type the name of a team:")
  points = 0
  numberOfGamesPlayed = 0
  
  #Display all the scores for the given team using a linear search
  file = open("results.txt","r")
  for line in file:
    data = line.split(";")
    homeTeam = data[0]
    awayTeam = data[1]
    if team == homeTeam or team==awayTeam:
      numberOfGamesPlayed += 1
      homeScore = int(data[2])
      awayScore = int(data[3])
      print(homeTeam + " - " + str(homeScore) + ":" + str(awayScore) + " - " + awayTeam)
      if homeScore == awayScore: #It's a draw
        points += 1
      elif homeScore>awayScore and team == homeTeam: #It's a win at home!
        points += 3
      elif awayScore>homeScore and team == awayTeam: #It's a win against the home team!
       points += 3  
  file.close() 
  print(team + " played " + str(numberOfGamesPlayed) + " game(s).")
  print(team + " has " + str(points) + " point(s) so far.")

Solution...

The solution for this challenge is available to full members!
Find out how to become a member:
➤ Members' Area

Page Rank Algorithm – Take the Quiz

Posted on May 23, 2018 by Administrator Posted in A Level Concepts, A Level Quiz, Algorithms, Computer Science, Computing Concepts

Check your understanding of the page rank algorithm used by search engines such as Google to sort search results.

To find out more about this algorithm, read this blog post first:
Search Engine Indexing and Page Rank Algorithm

Quiz #1

QuestionSolution

Find the page rank score of web page B:
page-rank-a-quiz

Page Rank Score for web page B = 14
page-rank-a-solution

Quiz #2

QuestionSolution

Find the page rank score of web page B:
page-rank-b-quiz

Page Rank Score for web page B = 12
page-rank-b-solution

Quiz #3

QuestionSolution

Find the page rank score of web page A:
page-rank-c-quiz

Page Rank Score for web page A = 14
page-rank-c-solution

Search Engine Indexing and Page Rank Algorithm

Posted on May 23, 2018 by Administrator Posted in A Level Concepts, A Level Quiz, Algorithms, Computer Science, Computing Concepts

Search Engines Indexing

Search engines like Google maintain huge databases called “indexes” of all the keywords and the web addresses of pages where these keywords appear.

When a web designer creates a new website they can contact the search engine to let them know they would like their web page to be scanned and added to the search engine index. They can do so by completing an online submission form. (e.g. https://www.google.com/webmasters/tools/submit-url)

Search engines also use “bots” (software robots) called web-bots or spider bots that constantly (24/7) crawl the web to scan webpages, update the index, follow hyperlinks to move from one page to the other. They can hence find new pages if these have been linked to existing pages that have already been indexed.

In their indexes, for each URL that has been indexed, a page rank score is also stored. This is a number that will be used to sort search results when displaying these to the end user.

Page Rank Algorithm

When a user uses a search engine (e.g. Google) the following steps take place:

A user submits a search query using Google’s search engine.
Google searches all of the pages/URLs it has indexed for relevant content. (based on keywords)
Google sorts the relevant pages/URLs based on PageRank scores.
Google displays a results page, placing those pages/URLs with the most PageRank (assumed importance) first.

So we can define the page rank score as a numerical value, calculated by a search engine for each page on the web to measure its degree of importance.

The page rank of a page is regularly updated when the spider bots of a search engine crawl the web.

Page Rank Formula?

Google does not disclose its exact PageRank formula. But it is a pretty safe bet that calculating PageRank is not easy math. The key concept of this formula though is as follows:

PageRank for a given page = Initial PageRank + (total ranking power of a page / number of outbound links of this page) + …

Where the total ranking power is calculated by adding the Page Rank score of all web pages that links to your own web page divided by the number of outbound links this page have. (“+…” means repeat this formula for each single page that links towards your page.)

Which means:

The more web pages link towards your web page, the higher the page rank score for your page.
The higher the page rank score of pages linking towards your web page, the higher the page rank score for your page.
If a webpage has a high page rank score but also have hundreds of outbound links it will not give you much page rank score. (e.g. This is to minimise the impact of “link sharing” to artificially boost your page rank score).

The following diagram shows how the page rank score of pages A to G is calculated. Each arrow on this diagram represents a hyperlink from one page to another page.

Page Rank Algorithm – Take the Quiz

Nowadays the Page Rank algorithm used by Google is based on a more complex formula that takes into consideration a wide range of other factors such as:

Is your website layout responsive / mobile friendly?
Is your website secure? (e.g. Using the https protocol)
Is your website regularly updated?
How long does it take for your web page to load on average?
etc.

SEO: Search Engine Optimisation

SEO refers to a range of techniques used to increase your visibility on major search engines. When designing and editing websites, web designers and web authors try to:

Use keywords rich web addresses (domain names, files names for html pages and picture files).
Use meta tags in each html page (Header section, invisible to the user but used by search engines).
Use a lot of relevant keywords in the text of the web pages.
Increase their page rank score by getting other websites to include hyperlinks to their website:
- Registering their website on business directories.
- Offering link exchange/sharing with other websites.
- Sharing links towards their website on social networks.

Learning Zone ✕

Theory Concepts

Interactive Quizzes

GCSE Computer Science (UK)

A-Level Computer Science (UK)

Coding Challenges ✕

Python Challenges

HTML / CSS & JavaScript

LMC

SQL

Block Programming

Interactive Coding Puzzles

Online Interactive Tools ✕

Coding Tools

Design Tools

Logic Gates Circuits

Cryptography Corner

Member's Area ✕

Register/Sign Up

Get In Touch

Books Corner

What is BCD code?

7-Segment Display

BCD to 7-Segment Display: Truth Tables & Karnaugh Maps

BCD to 7-Segment Display: Boolean Expressions

BCD to 7-Segment Display: Logic Gates Diagrams

Testing

BCD to 7-Segment Display Integrated Circuit

Hex/BCD to 7-Segment Display Integrated Circuit

Step 1: The electronic circuit

Step 2: Python Code

Your Challenge

Your Challenge

Step 1: Creating 9 tiles from a single picture, using CSS

Step 2: Table Layout

Step 3: Adding Interactivity and Game Logic using JavaScript

Full Code

Your Challenge

Solution...

Python Code

Your Challenge #1

Your Challenge #2

Flying Rocket Animation

Hello World Animation

Rolling Dice Animation

Space Invader Animation

Your Task

Solution...

Adding a Splash Screen to your Python Projects

Adding a Progress Bar to your Python Projects

Solution...

Task 1:

Task 2:

Task 3:

Top-Down Modular Design

Python Code

Solution

Solution...

Quiz #1

Quiz #2

Quiz #3

Search Engines Indexing

Page Rank Algorithm

Page Rank Formula?

SEO: Search Engine Optimisation

Our Latest Book

Recent Posts