Update pages/3_Adversarial_attack.py

pages/3_Adversarial_attack.py

@@ -20,7 +20,32 @@ SECONDARY_COLOR = '#bce7db'
 
 
 st.title('Adversarial Attack')
-st.write('How adversarial attacks affect ConvNeXt interpretation?')
+st.write('> **How adversarial attacks affect ConvNeXt interpretation?**')
+st.write("""Adversarial examples are inputs crafted to confuse neural networks, causing them to misclassify a given input. 
+These examples are not distinguishable by humans but cause the network to fail to recognize the image content. 
+One type of such attack is the fast gradient sign method (FGSM) attack, which is a white box attack that aims to ensure misclassification. 
+A white box attack is where the attacker has full access to the model being attacked.
+
+The FGSM attack is one of the earliest and most popular adversarial attacks. 
+It is described by Goodfellow _et al_ in their work on [Explaining and Harnessing Adversarial Examples](https://arxiv.org/abs/1412.6572). 
+The attack is simple yet powerful, using the gradients that neural networks use to learn. 
+Instead of adjusting the weights based on the backpropagated gradients to minimize loss, the attack adjusts the input data to maximize the loss using the gradient of the loss with respect to the input data.
+""")
+
+instruction_text = """Instruction to input:
+1. Choosing image: Users can choose a specific image by entering **Image ID** and hit the _Choose the defined image_ button or can generate an image randomly by hitting the _Generate a random image_ button.
+2. Choosing epsilon: **Epsilon** is the amount of perturbation on the original image under attack. The higher the epsilon is, the more pertubed the image is, the more confusion made to the model. 
+Users can choose a specific epsilon by engtering **Epsilon** and hit the _Choose the defined epsilon_ button.
+Users can also let the algorithm find the smallest epsilon automatically by hitting the _Find the smallest epsilon automatically_ button.
+The underlying algorithm will iterate through a set of epsilon in ascending order until reaching the **maximum value of epsilon**. 
+After each iteration, the epsilon will increase by an amount equal to **step** variable. 
+Users can change the default values of the two variable value optionally.
+"""
+st.write("To use the functionality below, users need to input the **image** and the **epsilon**.")
+with st.expander("See more instruction", expanded=False):
+    st.write(instruction_text)
+
+    
 
 imagenet_df = pd.read_csv('./data/ImageNet_metadata.csv')
 image_id = None